Question

我还有另外一个问题，并试图看看我是否可以让它以类似的方式工作，但我已经不成功了。我所拥有的是2个下拉菜单，其中一个根据您在frist下拉菜单中选择的内容创建了它的otpions但是我遇到了一个问题，我需要在相同的页面上使用相同的菜单两次，我认为可能已经工作但它没有。我已经修改了我自己的acord它是因为你不能有2个具有相同id的对象..我想知道如何使脚本波纹管工作与类而不是形式的id？

var i;
function fill_damage(i){
    var form1 = document.getElementById("form1a");
    document.form1aa.damage.options.length=0;
    switch(i)
    {
        case 1:
            form1.damage.options[0] = 
                new Option('Cracked screen','Cracked screen');
            form1.damage.options[1] =
                new Option('Cracked top case','Cracked top case');
            form1.damage.options[2] =
                new Option('Cracked bottom case','Cracked bottom case');
            form1.damage.options[3] =
                new Option('Broken keyboard','Broken keyboard');
            form1.damage.options[4] =
                new Option('Faulty touch pad','Faulty touch pad');
            form1.damage.options[5] =
                new Option('Hinge broken','Hinge broken');
            form1.damage.options[6] =
                new Option('Motherboard','Motherboard');
            form1.damage.options[7] =
                new Option('Hard drive','Hard drive');
            break;
        case 2:
            form1.damage.options[0] =
                new Option('Re image','Re image');
            form1.damage.options[1] =
                new Option('Wireless cert','Wirless cert');
            form1.damage.options[2] =
                new Option('Application','Application');
            form1.damage.options[3] =
                new Option('Hacked','Hacked');
    }
}


<form name="form1aa" method="post" id="form1a" >
    <select name="type" 
        onChange="fill_damage(document.form1aa.type.selectedIndex);">
        <option value="">Select Type</option>
        <option value="Hardware">Hardware</option>
        <option value="Software">Software</option>
    </select> 
    <select name="damage">
        <option selected="selected">Select Type First</option>
    </select>
</form>

Answer 1

您需要的是document.getElementsByClassName()

document.getElementsByClassName("yourClass")[0]; //first node with that class

虽然如你所见：http://www.quirksmode.org/dom/w3c_core.html#fivemethods但是IE 7/8没有实现这种方法。我建议看看像jquery这样的框架，以简化所有浏览器兼容性问题！

Answer 2

Matthew，这是一个演示版。希望我得到你想要的东西。

Source | Demo

但正如Allaire所说，这对旧的IE无效。你可以自定义getElementsByClassName（网上有很多）或者如果兼容性是一个问题就使用jQuery。

Answer 3

您需要的是document.querySelectorAll()或document.querySelector()。

document.querySelector(".yourClass"); //first node with that class

它就像一个jQuery，但在HTML5浏览器中是原生的！

这比document.getElementsByClassName更好，因为IE 8确实支持它！ http://www.quirksmode.org/dom/w3c_core.html#gettingelements

然后是不支持的：

if(!document.querySelectorAll){
    document.querySelectorAll = jQuery;
}

javascript如何使用class而不是id来下拉菜单

3 个答案: