试图使用jquery创建包含多个错误答案的文本输入

Trying to use jquery to create text input with multiple wrong answers

本文关键字:答案 错误 文本 输入 包含多 jquery 创建      更新时间:2023-09-26

我正试图为过敏的朋友创建一个页面,用户可以在其中输入食物,并获得关于我的朋友是否对其过敏的响应。我创建了一个包含他所有食物过敏的数组,目的是当用户输入任何给定的食物并点击提交时,页面将发出警报。

我是jquery的新手,已经拼凑了几个相近的例子,但很明显我缺少了一些连接部分。任何帮助都将不胜感激!

工作演示:http://jsfiddle.net/ssprockett/Ct2TU/1/

以下是迄今为止的jquery:

$('.submit').click(function () {
   if( $.inArray( $("input:text").val().toUpperCase(), ["cantaloupe", "almonds", "almond flour", "almond flour", "almond milk", "hazel nuts", "hazelnuts", "filberts", "pecans", "peanuts", "english walnuts", "watermelons", "grapefruit", "orange", "garlic", "mustard", "green pepper", "navy bean", "string bean", "cabbage", "carrot", "cauliflower", "lettuce", "bass", "peas", "sweet potatoes", "squash", "clams", "barley", "oat", "soy", "wheat", "rice", "gluten", "sea bass", "mustard seeds",  ] ) > -1 )  {
        alert("Nope. This will make him sick.");
    } else {
        alert("Yep. This is fine.");
    }

有几个小问题:

  1. 您没有在jsfiddle中包含jQuery
  2. 您缺少单击绑定函数的关闭})
  3. 应该使用.toLowerCase,而不是.toUpperCase,因为数组的所有值都是小写的

http://jsfiddle.net/Ct2TU/4/

toUpperCase()使所有这些值都为false。尝试toLowerCase()

这里有一个工作示例:

http://jsfiddle.net/jA7MB/

var allergy = ["cantaloupe", "almonds", "almond flour", "almond flour", "almond milk", "hazel nuts", "hazelnuts", "filberts", "pecans", "peanuts", "english walnuts", "watermelons", "grapefruit", "orange", "garlic", "mustard", "green pepper", "navy bean", "string bean", "cabbage", "carrot", "cauliflower", "lettuce", "bass", "peas", "sweet potatoes", "squash", "clams", "barley", "oat", "soy", "wheat", "rice", "gluten", "sea bass", "mustard seeds"];
$( ".submit" ).click(function() {
  if(($.inArray($('#food').val().toLowerCase(), allergy)) != -1){
   alert( "allergic!")
  } else alert("not allergic!");
});

你可以试试。