Question

我试图获取锚链接的值，该链接位于无序列表中并将其显示在文本框中。这是我当前的HTML代码。

              <div id="map-navigation" class="map-navigation" style="padding-top:50px;">
                      <div class="dropdown" >
                                      <button style ="border-radius:5px; width:100%; padding:5px;" class="btn btn-default dropdown-toggle" type="button" id="Button1" data-toggle="dropdown">
                                        Select a Marine Area
                                        <span class="caret"></span>
                                      </button>
                                         <ul id="marinelist" class="dropdown-menu" role="menu" aria-labelledby="dropdownMenu1" runat="server">
                                                <li "><a href="#" data-zoom="5" data-position="52.42922, -18.5154" value="Orginal map"> Orginal map.....</a></li>
                                                <li ><a  href="#" data-zoom="5" data-position="56.425, -21.85"> Irish Continental Shelf</a></li>
                                                <li ><a href="#" data-zoom="6" data-position="53.40, -9.0"> Irish Exclusive Economic Zone</a></li>
                                                <li ><a href="#" data-zoom="6" data-position="53.40, -10.0"> Irish Territorial Sea</a></li>
                                                <li ><a href="#" data-zoom="6" data-position="53.40, -9.0"> Irish Contiguous Zone</a></li>
                                                <li ><a href="#" data-zoom="10" data-position="53.212, -9.179" > Galway Bay</a></li>
                                                <li ><a href="#" data-zoom="12" data-position="53.44, -6.08"> Dundalk</a></li>
                                        </ul>
                        </div>
                      </div>
                                       <input id="bayarea" runat="server" type="text" readonly style="border:0px"/>

这是我的JavaScript

        script type="text/javascript">        onload = function () {
        var sel= document.getElementsById('marinelist')[0];
        var inp = document.getElementsById('bayarea')[0];
        sel.onchange = function () {
            inp.value = sel.value;
        }
    }</script>

目前，javascript无效，文本框中没有任何内容。这个问题本来可以提出来，如果有的话，你能指点我正确的方向吗？感谢

Answer 1

您使用的是getElementsById，但正确的语法是getElementById。这是单数，因为id应该是唯一的。

要获取所有列表项，可以使用document.querySelectorAll('#marinelist li');返回节点列表。

以下内容将li元素作为节点列表，然后将它们转换为可用于使用标准数组语法访问每个项目的数组：elems[2]。但是，这不是跨浏览器兼容的。

var elems = Array.prototype.slice.call(document.querySelectorAll('#marinelist li'));

如果只是一个项目，你试图得到它的值，你可以使用单数querySelector()，它将返回单个元素，然后你可以调用.value。

使用javascript在无序列表中获取锚标记值

1 个答案: