Question

我想搜索数组中的值。数组是使用某些值预定义的。将有一个HTML文本框来输入值。用户需要输入值。如果用户输入的值在数组中。它应显示“已找到值”或未找到。它应该使用AJAX。我的以下代码无效。

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<p>Enter a value: <input type="text" id="carInput" onchange="textChanged()"></p>
<p id="onListText"></p>
<script>
var cars = ["abc", "def", "ghi","jkl"];
var textChanged = function(){
  var inputText = $("#carInput").text();
  if($.inArray(inputText, cars) !== -1){
    $("#onListText").text("Value Found");
    return;
  }
}
</script>
</body>
</html>

Answer 1

  var inputText = $("#carInput").text();

这应该是

  var inputText = $("#carInput").val();

所以你的完整代码将是：

＆＃13;

 var cars = ["abc", "def", "ghi","jkl"];
var textChanged = function(){
  var inputText = $("#carInput").val();
  console.log(inputText);
  if($.inArray(inputText, cars) !== -1){
    $("#onListText").text("Value Found");
    return;
  } else {
    $("#onListText").text("Value not Found");
  }
}

＆＃13;

  
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<p>Enter a value: <input type="text" id="carInput" oninput="textChanged()"></p>
<p id="onListText"></p>

＆＃13;

Answer 2

尝试使用var inputText = $("#carInput").val();代替var inputText = $("#carInput").text();

并使用oninput事件。

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
</head>
<body>
<p>Enter a value: <input type="text" id="carInput" oninput="textChanged()"></p>
<p id="onListText"></p>
<script>
var cars = ["abc", "def", "ghi","jkl"];
var textChanged = function(){
  var inputText = $("#carInput").val();
  if($.inArray(inputText, cars) !== -1){
    $("#onListText").text("Value Found");
    return;
  }
}
</script>
</body>

Answer 3

$("#carInput").text();应为$("#carInput").val()

text()是选中所选元素中的所有文本

val()是表单控件的val

var cars = ["abc", "def", "ghi", "jkl"];
var textChanged = function() {
  var inputText = $("#carInput").val();
  if ($.inArray(inputText, cars) !== -1) {
    $("#onListText").text("Value Found");
    return;
  } else {
    $("#onListText").text("Value not Found");
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<p>Enter a value:
  <input type="text" id="carInput" onchange="textChanged()">
</p>
<p id="onListText"></p>

Answer 4

如果只想在失去焦点时触发事件，只需将text（）替换为val（）

即可

var inputText = $("#carInput").val(); //replace text() to val()

使用onkeyup（或oninput，由@mohamedrias建议）而不是onchange事件更适合你的情况。 onchange需要模糊才能解雇事件。

<p>Enter a value: <input type="text" id="carInput" onkeypress="textChanged()"></p>

onkeyup pnlkr

使用javascript使用用户输入搜索数组

4 个答案: