Question

如何将我的选择列表中的每个单词都指向另一个页面的超链接？

当leaderboard选择动态填充选项时（根据下面的代码），我想让选项可以点击并让它们重定向到指定的页面。

<select id='standings' name='standings' onchange="listTeam(this)">
    <option value='0'>A</option>
    <option value='1'>B</option>
    <option value='2'>C</option>
    <option value='3'>D</option>
</select>

<select id='leaderBoard' name='leaderBoard' multiple="multiple" size="1" style="width: 100px;"> </select>

<script type="text/javascript">

    var teams = [
                "x y z ",
                "e r t z u ",
                "w e r t",
            ],

            listTeam = function listTeam(sel) {
                var val = document.getElementById('standings').value, //get the selected value
                        team = teams[val], //get the selected team, based on value
                        lb = document.getElementById('leaderBoard'); //get the leaderBoard select element

                lb.options.length = 0;

                var people = team.trim().split(/\s/);
                for (var j = 0; j < people.length; j++) {
                    var opt = document.createElement('option')
                    opt.innerText = people[j];
                    lb.appendChild(opt);
                }
            };
    listTeam();

</script>

Answer 1

使用A进行测试只需更改数组等以与其余部分一起使用，在<option>上的'value ='内设置网址，选择重定向窗口位置

   var teams = [
       "x y z ",
       "e r t z u ",
       "w e r t", ];

   var urls = ["www.a.com", "www.a1.com", "www.a2.com"];

   listTeam = function listTeam(sel) {
       var val = document.getElementById('standings').value, //get the selected value
           team = teams[val], //get the selected team, based on value
           lb = document.getElementById('leaderBoard'); //get the leaderBoard select
       lb.options.length = 0;

       var people = team.trim().split(/\s/);

       for (var j = 0; j < people.length; j++) {
           var opt = document.createElement('option')
           opt.value = urls[j];
           opt.innerText = people[j];
           lb.appendChild(opt);
       }

       lb.onchange = function () {
           console.log("change");
           if (this.selectedIndex) {
               window.location.href = this.value;
           }
       }
   };
   listTeam();

html

<select id='standings' name='standings' onchange="listTeam(this)">
    <option value='0'>A</option>
    <option value='1'>B</option>
    <option value='2'>C</option>
    <option value='3'>D</option>
</select>
<select id='leaderBoard' name='leaderBoard' multiple="multiple" size="1" style="width: 100px;">

使选择列表中的每个选项成为指向不同页面的超链接

1 个答案: