使用 ajax-livesearch 功能时，如何向 js 发送 2 个变量？答案

【问题标题】：How can I send 2 variables to js When using ajax-livesearch function?使用 ajax-livesearch 功能时，如何向 js 发送 2 个变量？
【发布时间】：2018-04-21 09:10:43
【问题描述】：

我想使用 Ajax 的实时搜索功能。首先，我想从 HTML 中的多个选项中选择 1 个类别，如下所示。

   <form >
<select name="category" id="category" onchage="showResult()" title="choose the category which you'll search">
<option value="">카테고리를 선택하세요</option>
<option value="dic">사전</option>
<option value="term">의학용어 영한 표준번역</option>
<option value="kcd">질병표준코드</option>    
<option value="3d">3D</option>
<option value="ind">색인</option>
<option value="toc">목차</option>    
<option value="fig">그림</option>
<option value=:tab">표</option>
<option value="sw">소프트웨어</option>       
</select>
<input type="hidden" name="category" />

其次，我将输入我要搜索的文本。

<p><b>livesearch </b><input type="text" size="30" onkeyup="showResult(this.value)"></p>
</form>
<p> Hint -- <span id="livesearch"></span></p>

而且，Javascript 代码对我来说很难，因为我不知道如何从 html 表单中接收 2 个变量。

这是我的 JS。

function showResult(str) {
if (str.length==0) { 
document.getElementById("livesearch").innerHTML="";
document.getElementById("livesearch").style.border="0px";
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 (this.readyState==4 && this.status==200) {
  document.getElementById("livesearch").innerHTML=this.responseText;
  document.getElementById("livesearch").style.border="1px solid #A5ACB2";
 }
};
 var category = document.getElementById('category');
category.onchange = function(){
document.querySelector("input[name=category]").value = this.value;
}
xmlhttp.open("GET","livesearch_"+category.value+.php?q="+qstr,true);
xmlhttp.send();
 }
}

请给我一份你慷慨的善意。

【问题讨论】：

您的 JS 看起来无效 - 检查 xmlhttp.open 行。
年份。我被困在 JS 那里。
你甚至还没有定义qstr是什么...

标签： javascript html ajax livesearch

【解决方案1】：

我终于解决了上面的问题。

完整代码如下。

<script>
function showUser1(str) // call function without parameter
{
 if (window.XMLHttpRequest)
{

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("hint").innerHTML=xmlhttp.responseText;
  }
  }
var category = document.getElementById('category').value;
var qstr = document.getElementById('qstr').value; // get value of qstr

xmlhttp.open("GET","./livesearch_" +category + ".php?q="+qstr,true);
xmlhttp.send();
}
</script>

和 HTML 代码一样。

  <form>
  <select name="category" id="category" onchange="showUser1()" title="choose 
  the language you want">
  <option value="dic">사전</option>
  <option value="term">의학표준용어 : 영-한 </option>    

  </select>
  Input: <input name="search" id="qstr" onkeyup="showUser1()" >  
  </form>
  <div id="hint"><b>Disease information will be listed here.</b></div>

感谢您的关心。

【讨论】：