javascript - 从另一个下拉列表中选择值时获取下拉列表中的值

Question

我的网页有两个下拉列表1)含书名2)包含本书的链接。数据以XML文件的形式存储像这样的东西:

<?xml version="1.0" encoding="UTF-8"?>
<BookDetail>
<book>
    <bookName>Dollar Bahu</bookName>
    <link>http:\\DollarBahu.in</link>
</book>
<book>
    <bookName>The Lost Symbol</bookName>
    <link>http:\\TheLostSymbol.in</link>
</book>
<book>
    <bookName>Keep The Change</bookName>
    <link>http:\\KeepTheChange.in</link>
</book>
</BookDetail>

功能: window.onload=函数() { var xhttp = new XMLHttpRequest(); xhttp.open("GET", "bookDetails.xml", false); xhttp.send(); xhttp.onreadystatechange = 函数() { if (xhttp.readyState == 4 && xhttp.status == 200) { var xml = xhttp.responseXML; var books = xml.getElementsByTagName('book'); var book = document.getElementById('book'), link = document.getElementById('link');

                    for (i = 0; i < books.length; i++)
                    {
                        var obook = document.createElement('option'),
                        olink = document.createElement('option'),
                        tbook =   document.createTextNode(books[i].children[0].innerHTML),
                        tlink =   document.createTextNode(books[i].children[1].innerHTML);

                        obook.appendChild(tbook);
                        olink.appendChild(tlink);
                        book.appendChild(obook);
                        link.appendChild(olink);
                        map[tbook] = olink;
                    }
                    var updateLink = function(e)
                    {
                        //map[e.target.value].setAttribute('selected','');
                        //alert(map[e.target.value]);
                        for (var i = 0; i< link.children.length; i++)
                        {
                            link.children[i].removeAttribute('selected');
                        }
                           link.children[this.selectedIndex].setAttribute('selected','');
                    };
                    book.addEventListener('change', updateLink, false);
                }


                //var xmlString = "<BookDetail><book>    <bookName>Dollar Bahu</bookName>    <link>http:\\DollarBahu.in</link></book><book>    <bookName>The Lost Symbol</bookName>    <link>http:\\TheLostSymbol.in</link></book><book>    <bookName>Keep The Change</bookName>    <link>http:\\KeepTheChange.in</link></book></BookDetail>";
                //var xml = ( new window.DOMParser() ).parseFromString(xmlString, "text/xml"),i,
                //map = {};

            }

        }
    </script>

我已连续在包含 bookName 的第一个下拉列表中插入值。现在我的问题是如何从 XML 中获取该特定 bookName 的第二个下拉列表中的书籍链接？

Answer 1

在 bookName 下拉列表的 onchange 事件中，您可以检索 selectedIndex 属性，然后使用该值获取相应的图书链接。