匹配输入值和数组

时间:2014-10-20 15:35:11

标签: javascript html arrays

我很困惑匹配输入值和数组。

我有一个输入框,可以输入作者姓名:

<b>Author's name:</b> 
<input type="text"  name="authorName">

总共有三位作者,我将它们放在一个数组中:

var authorName =["a","b","c"];

在下拉列表中有三本书与这些作者相匹配:

<b>Select Book:</b>
<select name="selectBook" id="bookName">
<option value="" selected="selected">-</option>
<option id="bookA"value="q">My Decade In The Premier League</option>
<option id="bookB"value="r">Harry Potter</option>
<option id="bookC"value="s">Twilight</option>
</select>

这是一个显示该书信息的文本区域;

如果用户输入“a”并选择下拉列表“q”,请提供信息“x”;

如果用户输入“b”并选择下拉列表“r”,请提供信息“y”;

如果用户输入“c”并选择下拉列表“s”,则给出信息“z”;

<br>
<input type="button" value="RETRIEVE">
<br> 
<textarea name="infoBox"></textarea>

如果输入名称不在数组中或与书名不匹配。

textarea框将输出"author name is incorrect!"

我不知道该怎么做。

2 个答案:

答案 0 :(得分:0)

以下代码应该有效

          $(document).ready(function () {

        $("#RETRIEVE").click(
            function () {
                retrieve();
            }            
        );
    });

function retrieve() {
    var authorName =["a","b","c"];
    var text = $('#authorName').val();
    var drop= $('#bookName :selected').text();
  if ((authorName.indexOf(text) != -1) && $("#bookName").get(0).selectedIndex-1== $.inArray(text,authorName))

        $('#infoBox').val(drop);

    else        
       $('#infoBox').val("Incorrect name");


}

以上的Jsfiddle是http://jsfiddle.net/yzqqr8ws/

答案 1 :(得分:0)

我认为这就是你要找的东西。提交答案后,它会检查该值是否在您的数组中,并且它是否与书籍描述相匹配。然后返回yes或no

var authorName =["a","b","c"];

$("#retrieve").click(function(){

  var selectedAuthor = $(".author-name").val();
  var selectedBook = $("#bookName").children(":selected").attr("id");;

  if( ($.inArray(selectedAuthor, authorName) > -1) && (selectedBook == "book-"+selectedAuthor) ) {

    $("#results").val("YEP ITS A MATCH");
  }else{
    $("#results").val("SORRY, NO MATCH");

  }

});

FIDDLE

<强>更新

显示所选书籍:

NEW FIDDLE

NEW UPDATE 为图书信息添加了一个单独的数组:

NEW FIDDLE 2