如何通过单击Javascript中的链接,使用链接的值设置下拉列表值

时间:2016-03-23 12:47:17

标签: javascript html

我想通过点击链接为下拉列表设置一个值,我试过这样的事情,但它不起作用:

<html>
 <body>
    <select id="select">
       <option value="one">one</option>
       <option value="two">Two</option>
       <option value="three">Three</option>
    </select><br />

  <a class="link1" value="two" href="page.php?cc=two">Two</a><br /><br />
  <a class="link1" value="three" href="page.php?cc=three">Three</a>

  <script> 
       function setSelect () {

           var elmnt = document.getElementsByClassName('link1');

             for (i = 0; i < elmnt.length; i++) {
                    elmnt[i].onclick = function () {
                    document.getElementById('select').value = elmnt[i].getAttribute("value");
                    window.history.pushState('Form', 'My form', this.getAttribute("href"));
                    return false;

                    };                  
            }
       }


       setSelect ();

    </script>
 </body>
 </html>  

我还尝试通过点击链接将URL中的值输入到下拉列表中,但它不起作用,因此我尝试使用链接值设置下拉列表。
任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

问题在您的javascript代码中请添加此

<script>
    function setSelect() {

        var elmnt = document.getElementsByClassName('link1');

        for (i = 0; i < elmnt.length; i++) {
            elmnt[i].onclick = (function (i) {
                return function () {
                    document.getElementById('select').value = elmnt[i].getAttribute("value");
                    window.history.pushState('Form', 'My form', this.getAttribute("href"));
                    return false;
                };
            })(i)
        }
    }
    setSelect();

</script>