无法将正确的数据从Javascript数组中提取到HTML表单中

时间:2011-01-10 01:40:21

标签: javascript function forms

我正在尝试返回相应作者姓名和书名的描述值(在文本框中输入)。问题是无论如何,第一个描述都显示在文本区域中。

<h1>Bookland</h1>
<div id="bookinfo">
    Author name: 
    <input type="text" id="authorname" name="authorname"></input><br />
    Book Title:
    <input type="text" id="booktitle" name="booktitle"></input><br />
    <input type="button" value="Find book" id="find"></input>
    <input type="button" value="Clear Info" id="clear"></input><br />
    <textarea rows="15" cols="30" id="destin"></textarea>
</div>

JavaScript的:

var bookarray = [{Author: "Thomas Mann", Title: "Death in Venice", Description: "One of the most famous literary works of the twentieth century, this novella embodies" + "themes that preoccupied Thomas Mann in much of his work:" + "the duality of art and life, the presence of death and disintegration in the midst of existence," + "the connection between love and suffering and the conflict between the artist and his inner self." },
                 {Author: "James Joyce", Title: "A portrait of the artist as a young man", Description: "This work displays an unusually perceptive view of British society in the early 20th century." + "It is a social comedy set in Florence, Italy, and Surrey, England." + "Its heroine, Lucy Honeychurch, struggling against straitlaced Victorian attitudes of arrogance, narroe mindedness and sobbery, falls in love - while on holiday in Italy - with the socially unsuitable George Emerson." },
                 {Author: "E. M. Forster", Title: "A room with a view", Description: "This book is a fictional re-creation of the Irish writer'sown life and early environment." + "The experiences of the novel's young hero,unfold in astonishingly vivid scenes that seem freshly recalled from life" + "and provide a powerful portrait of the coming of age of a young man ofunusual intelligence, sensitivity and character. " },
                 {Author: "Isabel Allende", Title: "The house of spirits", Description: "Allende describes the life of three generations of a prominent family in Chile and skillfully combines with this all the main historical events of the time, up until Pinochet's dictatorship." },
                 {Author: "Isabel Allende", Title: "Of love and shadows", Description: "The whole world of Irene Beltran, a young reporter in Chile at the time of the dictatorship, is destroyed when" + "she discovers a series of killings carried out by government soldiers." + "With the help of a photographer, Francisco Leal, and risking her life, she tries to come up with evidence against the dictatorship." }]


function searchbook(){
    for(i=0; i &lt; bookarray.length; i++){
        if ((document.getElementById("authorname").value &amp; document.getElementById("booktitle").value ) == (bookarray[i].Author &amp; bookarray[i].Title)){
            document.getElementById("destin").value =bookarray[i].Description
            return bookarray[i].Description
        } 
        else {
            return "Not Found!"
        }
    }
}
document.getElementById("find").addEventListener("click", searchbook, false)

2 个答案:

答案 0 :(得分:1)

你的代码由于某种原因得到了html转义,但我认为问题出在你的if中。无论如何,这应该给你你的答案,并且稍微快一点,因为它不会试图在循环内的dom中查找元素

function searchbook(){
  var author = document.getElementById('authorname').value;
  var title = document.getElementById('booktitle').value;
  for (var i=0, book; book = bookarray[i]; i++) {
    if (book.Title == title && book.Author == author) {
      return book.Description;
    }
  }
  return "Not Found"
}

答案 1 :(得分:0)

此代码更灵活,可以为您填充文本区域。

function searchbook(){
    var author = document.getElementById("authorname").value;
    var book = document.getElementById("booktitle").value;
    for(i=0; i < bookarray.length; i++){
        if(bookarray[i].Author.match(author) || bookarray[i].Title.match(book))
        {
             document.getElementById("destin").value = bookarray[i].Description;
             break;
        }
    }
}

如果在该特定元素上没有用户输入,我不确定为什么要使用textarea。