在HTML中,如何使用输入html代码更改选择选项菜单?

时间:2014-01-18 09:40:23

标签: javascript jquery html

我的代码在表单select-option html代码中运行良好。 但表单输入菜单没有。 以下是我的代码。

<script>
   function showUser(str)
 {
 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","getuser.php?q="+str,true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<option value="1">Peter Griffin</option>
<option value="2">Lois Griffin</option>
<option value="3">Glenn Quagmire</option>
<option value="4">Joseph Swanson</option>
</select>
</form>
<br>
<div id="txtHint"><b>Person info will be listed here.</b></div>

以上是好的!但下面是我的代码。为什么不工作? 输入类型=“提交”也不能很好地工作。 我怎样才能克服这个问题?

 <script>
  same as above...
 </script>
 </head>
 <body>
 <form>
 <select name="users" onchange="showUser(this.value)">
  ## Here is wrong, input element.##
      <input type="text" name="users" onkeyup="showUser(this.value)>
 </select>
 </form>
 <br>
 <div id="txtHint"><b>Person info will be listed here.</b></div>

有什么问题? 救救我!

1 个答案:

答案 0 :(得分:2)

您缺少结束语

你有

onkeyup="showUser(this.value)>

应该是:

onkeyup="showUser(this.value)">

您也无法在<input>内嵌套<select>。请参阅此jsfiddle并注意</select>为红色,因为它无效。小提琴中的第二个选择正确完成。