我试图通过一个包含200多个条目的选择列表,然后单击每个条目。在元素上单击时,将执行selectCountry()函数,该函数会向表中添加一行。我想让它创建一个带有选择的每个选项的表。感兴趣的页面位于:http://www.world-statistics.org/result.php?code=ST.INT.ARVL?name=International%20tourism,%20number%20of%20arrivals

到目前为止,我有以下内容,但它似乎不起作用:

var sel = document.getElementById('selcountry');
var opts = sel.options;
for(var opt, j = 0; opt = opts[j]; j++) {selectCountry(opt.value)}


我正在尝试在Chrome的控制台中执行此操作。

最佳答案

开发工具最有用的功能之一是,当您编写一个函数的名称时,便会获得其源代码。这是selectCountry函数的源代码:

function selectCountry(select) {
        if (select.value == "000") return;
        var option = select.options[select.selectedIndex];
        var ul = select.parentNode.getElementsByTagName('ul')[0];
        var choices = ul.getElementsByTagName('input');
        for (var i = 0; i < choices.length; i++)
            if (choices[i].value == option.value) {
                $("#selcountry:selected").removeAttr("selected");
                $('#selcountry').val('[]');
                return;
            }
        var li = document.createElement('li');
        var input = document.createElement('input');
        var text = document.createTextNode(option.firstChild.data);
        input.type = 'hidden';
        input.name = 'countries[]';
        input.value = option.value;
        li.appendChild(input);
        li.appendChild(text);
        li.onclick = delCountry;
        ul.appendChild(li);
        addCountry(option.firstChild.data, option.value);
        $("#selcountry:selected").removeAttr("selected");
        $('#selcountry').val('');
    }


您的缺点现在很明显。 selectCountry接受整个select元素作为参数,而不是select的值(这是一个糟糕的设计,但是meh)。而不是传递元素的值,而是更改其索引:

var sel = document.getElementById('selcountry');
var opts = sel.options;
for(var i = 0; i < opts.length; i++) {
    sel.selectedIndex = i
    selectCountry(sel)
}

07-24 14:21