现在的位置: 首页 > 综合 > 正文

document.getElementById获取不到值的几种原因分析

2013年09月19日 ⁄ 综合 ⁄ 共 1353字 ⁄ 字号 评论关闭

 前几天修改那个分页类,想加入跳转到指定页的功能,就是用户直接输入页码,点击按钮就可以跳到指定的页码!

    一看这个需求,就可以想到利用GET传值的方式,但常规GET方式需要把链接写入标签的a href里面,而我们实际上是希望用按钮来进行点击,而不是一个简单的超链接形式。于是这里就得用到Javascript在按钮的onclick事件下写代码。很明白,就是将input的value(用户输入的页码)传到onclick的代码里,这里用javascript的location来完成跳转。

    好了,整体就是这个样子,至于getElementById这个方法我就不多说了。重点说说我遇到的问题以及如何解决的。

1.Javascript本身不会报错,只要不出你预期的结果,那么代码肯定是有问题的。这个时候可以看看代码里的符号,比如说单引号、双引号、大括号、小括号等等...因为这段代码不是直接在JS文件中写的,而是用PHP进行构造来输出的,再加上PHP本身输出需要用到单引号、双引号,所以这个时候很多符号混合在一起是很容易出错。不要紧,你可以先运行一下,然后再查看网页源代码来看看当前的Javascript到底是不是你需要的那一段,看到少了什么符号我们就立马给补上,不过这个时候还需要注意一点,如果要直接输出单引号、双引号的话,在PHP的代码里这里需要用‘\’来进行转义。

上面的问题一般是不会弹出任何结果的,即使我们用alert来查看设置的变量,因为Javascript代码存在问题,它根本就没办法执行!假设你已经改正了语法上的错误,那么我们继续看...我们可以用以下代码来获取用户输入的页码,并打印输出看看正确与否。

  1. var uPage=document.getElementById('pa').value; 
  2. alert(uPage); 

2.如果这个时候一直弹出"undefined"的提示,那么至少说明你的Javascript代码正确运行了,它没有语法上的错误!至于为什么undefined,我调试了很久都没找出原因,后来无意中尝试把value改成innerHTML,居然打印出了一些结果,不过仔细一看才知道打印出的是一个同id名的div中的内容,这下才恍然大悟...在分页类中直接给input标签的id取名为page了,而这个page我在其他的div中也使用了。于是将分页类中input的id改为一个很变态的名字。其实这个时候就应该注意到这些问题,如果我们的代码可能会提供给其他人使用,那么命名就很重要了,如果只是在内部(就比如说我这里input这个标签只在类里面使用),那么名字应该尽量取得复杂一些,这样它与用户的命名发生冲突的可能性就很小了。

     最后:

  1. document.getElementById('idname').value;//获取input标签里的值,value; 
  2. document.getElementById('idname').innerHTML;//获取div里的html内容
  3. 换种写法取值.//value = document.getElementById("**").value;              value = document.getElementsByName("**)[0].value; 

【上篇】
【下篇】

抱歉!评论已关闭.