学习Ajax时遇到的一些小问题

问题1
变量定义的问题

 <Script type="text/javascript">

 function  check(){
    var xmlhttp;
    var url;
    url = document.getElementById("userid").value;
    if(window.XMLHttpRequest){
        xmlhttp=new XMLHttpRequest();
    }
    else {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=callback;
    xmlhttp.open("post", "Ajax/myAjax.jsp?username="+escape(url) ,true)
    xmlhttp.send();
  }
 function  callback(){
        if(xmlhttp.readyState==4 && xmlhttp.status== 200){
        var um = document.getElementById("myDiv");
        um.innerHTML= xmlhttp.responseText;
        }
        else{
        alert(xmlhttp.readyState);
        alert(xmlhttp.status);
        }
    }
 </Script>

在函数check调用callback的时候 由于xmlhttp定义在check里面.所以
运行报错:xmlhttp未定义;

修改后:

  var xmlhttp;
 function  check(){
    var url;
    url = document.getElementById("userid").value;
    if(window.XMLHttpRequest){
        xmlhttp=new XMLHttpRequest();
    }
    else {
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=callback;
    xmlhttp.open("post", "Ajax/myAjax.jsp?username="+escape(url) ,true)
    xmlhttp.send();
  }
 function  callback(){
        if(xmlhttp.readyState==4 && xmlhttp.status== 200){
        var um = document.getElementById("myDiv");
        um.innerHTML= xmlhttp.responseText;
        }
        else{
        alert(xmlhttp.readyState);
        alert(xmlhttp.status);
        }

    }
 </Script>

问题2
测试运行时 表现为 xmlhttp.readystate 一直等于0的问题
后才发现是check函数调用 callback函数时出了问题.

xmlhttp.onreadystatechange=callback();
function callback(){}

这种错误写法是指callback函数会将返回值赋值给 xmlhttp.onreadystatechange

所以正确写法为:不加括号

xmlhttp.onreadystatechange=callback;
function callback(){}

问题4
在JavaScript中 获取 HTML的标签的 value 值中遇到空格的问题
问题描述01

<script type="text/JavaScript">
function ponclick(){
var str = document.getElementById("p").innerHTML;
alert(str);//结果为a b c
document.getElementById("p").outerHTML="<input value=" + str + ">" ;
}//结果为 a 空格后面内容丢失
</script>

  <p id="p" onclick="ponclick()" >a b c</p> 

解决办法:

<script type="text/JavaScript">
function ponclick(){
var str = document.getElementById("p").innerHTML;
document.getElementById("p").outerHTML="<input value=" + "''" + str+ "''" + ">" ;//在str 上加上双引号;
}
</script>

  <p id="p" onclick="ponclick()" >a b c</p> 

问题描述02

在JSP 中 input 带有空格的 value 值 丢失问题

<input name="name" type="text" value=<%=name%>>
 <!-- name如果为 "a  b  c" 只有a能显示出来-->

解决办法

<input name="name" type="text" value= "<%=name%>" >

在<%name%> 外面加上双引号