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

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();

因此，您的完整代码将是：

  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"); } }

 <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>

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 个解决方案

解决方案1
1 2015-04-10 05:04:00

解决方案2
1 2015-04-10 05:09:11

解决方案3
1 2015-04-10 05:11:51

解决方案4
0 2015-04-10 05:05:03

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

问题描述

4 个解决方案

解决方案1 1 2015-04-10 05:04:00

解决方案2 1 2015-04-10 05:09:11

解决方案3 1 2015-04-10 05:11:51

解决方案4 0 2015-04-10 05:05:03

解决方案1
1 2015-04-10 05:04:00

解决方案2
1 2015-04-10 05:09:11

解决方案3
1 2015-04-10 05:11:51

解决方案4
0 2015-04-10 05:05:03