0

我有一个输入文本，我希望当我单击一个按钮时，它会采用该值并将其传递给 url 中的参数，这是我目前的代码：

<div id="landmark-1" data-landmark-id="1">
    <form  name ="data">
        <label>enter your name :</label>
        <input type= "text"  placeholder="ID" name="ID" value="" style="width:206px;"  />
        <input type="submit"  value="Suivant" onclick="showUser(this.form)" >
     </form>    
</div>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div>

这是我的 javascript 代码：

<script>
function showUser(frm)
{
    var str = frm.ID.value;
    if (str==""){
        document.getElementById("txtHint").innerHTML="";
        return;
    } 
    if (window.XMLHttpRequest){
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp=new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange=function() {
        if (xmlhttp.readyState==4 && xmlhttp.status==200){
            document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
        }
    }
    xmlhttp.open("GET","http://localhost/filename/page.php?q="+str,true);
    xmlhttp.send();
}
</script>

但是当我输入一个名字时，它只是在当前页面的 url 中添加：?ID=name ！它不会在我想要的 url 中发送参数..

4

2 回答 2

0

这是修改后的 AJAX 调用。它比 w3schools 的例子要复杂一些，但它更实用、更完整。首先是 AJAX 例程：

function AJAX( url, processFunction ) {
  var XHR;
  try{
    // Opera 8.0+, Firefox, Safari/Chrome
    XHR = new XMLHttpRequest();
  }catch (e){
    // Internet Explorer Browsers
    try{
      XHR = new ActiveXObject("Msxml2.XMLHTTP");
    }catch (e) {
      try{
        XHR = new ActiveXObject("Microsoft.XMLHTTP");
      }catch (e){
        // Something went wrong
        alert("Your browser doesn't support AJAX!");
        return false;
      }
    }
  }
  if( XHR.onreadystatechange ) {
    if( XHR.readyState == 4 ) {
      if( XHR.status == 200 ) {
        //--- we've got the data so process it
        processFunction( XHR.responseText );
      }
      if( XHR.status != "OK" ) {
        alert( 'Error : '+XHR.responseText);
      }
    }
  }
  //--- open
  XHR.open( 'GET', url ); // --- url is from the function call
  //--- send  
  XHR.send();
}

现在是处理返回数据的函数。在这种情况下，您只想显示文本：

function processMyData( data ) {
   document.getElementById("txtHint").innerHTML= data;
}

现在为修改后的 showUser 函数

function showUser(frm) {
    var str = frm.ID.value;
    if (str==""){
        document.getElementById("txtHint").innerHTML="";
        return false;
    } else {
      AJAX( "http://localhost/filename/page.php?q="+str, 'processMyData' )
    }
}

如果您的 php 文件中有错误，它应该显示在警告框中。

如果您的代码仍然没有返回任何内容并且没有错误，那么我唯一能想到的另一件事是您没有回显/打印您的数据以供 AJAX 例程检索您的文本。

于 2013-08-30T19:13:24.487 回答
0

将您的代码从：o 更改nclick="showUser(this.form)"为onclick="return showUser(this.form)"

和

if (str==""){
    document.getElementById("txtHint").innerHTML="";
    return;
}

到 if (str==""){ document.getElementById("txtHint").innerHTML=""; 返回假；}

即使没有输入 ID，您的表单也会被提交。return false 阻止表单提交。

于 2013-08-30T16:01:02.247 回答