0

我有两个项目首先是一个下拉框，一旦用户选择它的选项将触发一个javascript代码并在同一页面上显示结果，

第二个是输入框和搜索按钮，一旦用户键入内容并单击搜索按钮，它就会触发 javascript，但由于某些原因，它会将值添加到当前页面地址而不是重定向到其他页面，并且 xmlhttp.status 返回0。

它不是重定向到 class/myresults.php 而是将 item1 及其值添加到当前页面地址 www.myexample.com/index.php?item1=computer

我的表格不起作用

<form action="">
               <input name="search" type="text" title="Search"/>
               <input type="submit" value="search" onclick="finditem(this.form.search.value)"/>
</form>


function finditem(option){
    alert(option); <<<<shows the correct entered value
     if (window.XMLHttpRequest)
        {
            xmlhttp=new XMLHttpRequest();
        }
        else
        {
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            alert(xmlhttp.status);  << returns 0
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById("Result").innerHTML=xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","class/myresults.php?item1="+option,true);
        xmlhttp.send();
    }

有效的下拉框的java脚本

<select name="items" onchange="findbox(this.value)">
   .....
  </select>

 function findbox(option){
             if (window.XMLHttpRequest)
                {
                    xmlhttp=new XMLHttpRequest();
                }
                else
                {
                    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
                }
                xmlhttp.onreadystatechange=function()
                {
                    if (xmlhttp.readyState==4 && xmlhttp.status==200)
                    {
                        document.getElementById("Result").innerHTML=xmlhttp.responseText;
                    }
                }
                xmlhttp.open("GET","class/myresults.php?item2="+option,true);
                xmlhttp.send();

            }
4

1 回答 1

2

您的表单被提交，即浏览器将数据发布到它找到您的页面的同一位置。你似乎不希望那样。因此，您应该阻止提交表单。要做到这一点，你不应该听onclick按钮的事件，而应该听onsubmit表单的事件：

<form action="" onsubmit="return finditem(this.search.value)">
               <input name="search" type="text" title="Search"/>
               <input type="submit" value="search"/>
</form>

这是 JavaScript：（注意finditem返回 false 以防止表单实际提交。）

function finditem(option){
     if (window.XMLHttpRequest)
        {
            xmlhttp=new XMLHttpRequest();
        }
        else
        {
            xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
        }
        xmlhttp.onreadystatechange=function()
        {
            if (xmlhttp.readyState==4 && xmlhttp.status==200)
            {
                document.getElementById("Result").innerHTML=xmlhttp.responseText;
            }
        }
        xmlhttp.open("GET","class/myresults.php?item1="+option,true);
        xmlhttp.send();

        return false;
    }
于 2013-06-12T23:22:33.803 回答