匹配下拉列表值和數組

Question

我需要匹配下拉列表值和數組。然後我遇到了一些問題。

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

和作者的名稱必須與書

<form name="myForm" action=""> 
    Author's name: <input type="text" name="authorName"><br> 

和這裏的名稱相匹配是一個下拉列表

<select name="selectBook" id="bookName"> 
    <option value="" selected="selected">-</option> 
    <option id="bookA"value="q">q</option> 
    <option id="bookB"value="r">r</option> 
    <option id="bookC"value="s">s</option> 
</select> 

如果作者a匹配本書q然後輸出書信息x

如果筆者b匹配本書r然後輸出圖書信息y

如果作者c匹配本書q然後輸出圖書信息z

在一個文本框

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

輸出必須怎麼做呢？ 感謝您的幫助

Answer 1

所以，你可以做這樣的事情使用對象：

var authors = { 
 
       a: { 
 
        books: { 
 
\t \t \t  q:"x" 
 
\t \t   } 
 
       }, 
 
       b: { 
 
        books: { 
 
\t \t \t  r:"y" 
 
\t \t \t } 
 
       }, 
 
       c: { 
 
        books: { 
 
\t \t \t  q:"z" 
 
\t     } 
 
       } 
 
} 
 

 
function findBookByName(name){ 
 
    for(a in authors){ 
 
    for(b in authors[a]){ 
 
     if(authors[a][b].hasOwnProperty(name)) return authors[a][b][name];  
 
    } 
 
    } 
 
    
 
    return "NOT FOUND" 
 
} 
 

 
window.addEventListener('load', function(){ 
 
    var selectBook = document.getElementById("bookName"), 
 
     buttonRetrieve = document.getElementById("btnRetrieve"), 
 
     infoBox = document.getElementsByName("infoBox"); 
 
    
 
    buttonRetrieve.addEventListener('click', function(){ 
 
    var result = findBookByName(selectBook.value); 
 
    infoBox[0].value = result; 
 
    
 
    }) 
 

 

 
})

<select name="selectBook" id="bookName"> 
 
    <option value="" selected="selected">-</option> 
 
    <option id="bookA"value="q">q</option> 
 
    <option id="bookB"value="r">r</option> 
 
    <option id="bookC"value="s">s</option> 
 
</select> 
 

 
<input type="button" id="btnRetrieve" value="RETRIEVE"> 
 
<textarea name="infoBox" cols="120"></textarea>

Answer 2

爲了映射到基本不同的值，你可以設置一個2-暗淡「數組」像2-昏暗的關鍵：

：

var Info_for_Author_and_Book = { 
'author_a' : { 
    'book_q' : "Info for a, q", 
    ... 
    'book_s' : "Info for a, s" 
    }, 
    ... 
'author_c' : { 
    'book_q' : "Info for c, q", 
    ... 
    'book_s' : "Info for c, s" 
    } 
} 

您可以通過訪問信息數據

var selected_info = (Info_for_Author_and_Book[author] && Info_for_Author_and_Book[author][book]) || "Not available";