0

这是我的 html 文件，它调用提交按钮的处理函数 onclick。我的问题是，当我调用作为 javascript 函数的 process 函数时，它会刷新漏洞页面，并且 ajax 没有返回任何内容，#loadscreen 也没有显示任何内容 

<head><script src="jquery-1.9.1.min.js"></script></head>
<form  name="myForm">
Category
        <select name="category">
            <option>..........</option>
            <option>.........</option>
            <option>.......</option>
            <option>......</option>

        </select>
        <br/><br/>


Experience      <br/>   
        <select name="experience">
            <option>......</option>
            <option>......</option>
            <option>......</option>
            <option>......</option>
            <option>......</option>


        </select>
        <br/><br/>

Location            
        <select name="location">
            <option>......</option>
            <option>......</option>
            <option>......</option>
            <option>.......</option>
            <option>........</option>
        </select>

<input type="submit" name="submit" value="Search" onclick="Process(); return false;">    </input>           
</form>
<div id="container" style="z-index: 1; width: 830px; height: 356px; position: absolute; top: 194px; left: 218px"></div>
<div id="loadScreen" style="display: none;width: 100%; height: 100%; top: 0pt;left: 0pt;">
<div id="loadScr" style="filter: alpha(opacity = 65);  z-index: 9999;border: medium        none; margin: 0pt; padding: 0pt; width: 100%; height: 100%; top: 0pt;left: 0pt; background-color: rgb(0, 0, 0); opacity: 0.2; cursor: wait; position: fixed;"></div>
<div id="loader"  style="z-index: 10000; position: fixed; padding: 0px; margin: 0px;width: 30%; top: 40%; left: 35%; text-align: center;cursor: wait; ">
<img src="busy.gif" alt="loading" />
</div>
</div>

这是使用 ajax 的 Process 函数的代码和繁忙页面的代码

function Process( )
{
$('#loadScreen').show(function() {
var exp = document.forms['myForm']['experience'].value;
      var loc = document.forms['myForm']['location'].value;
      var cat = document.forms['myForm']['category'].value;

    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("container").innerHTML=xmlhttp.responseText;
             }
      }

    xmlhttp.open("GET","filter.php?experience="+ exp +"&location=" + loc + "&category=" + cat, true);
    xmlhttp.send();
});
}
4

1 回答 1

1

不知道如何按照您的方式进行操作，但您可以使用已内置功能的JQuery库。例如：

$.ajax({
   type: 'get',
   url: 'filter.php',
   data: {
      experience: exp,
      location: loc,
      category: cat
   }, 
   beforeSend: function() {
      //code to be executed while script is executing.
      $('#your_img_loader').fadeIn(500);
   },
   success: function(result) {
      //done executing hide loader
      $('#your_img_loader').hide();

      /* OTHER CODE */
   }
});

请注意，如果您想在 URL 旁边传递 GET 参数，您也可以这样做：

url: 'filter.php?experience='+exp+'&location='+loc+'&category='+cat

并删除data: {}部分

于 2013-03-27T19:00:11.373 回答