Question

我想在网站加载时最初只有一个下拉菜单。让我们说下拉菜单只有两个选项＆＃34; A＆＃34;和＆＃34; B＆＃34;。如果用户选择选项＆＃34; A＆＃34;我想要另一个下拉菜单出现在网站上（就在原版下面）。如果用户选择选项＆＃34; B＆＃34;我希望在原始下方显示不同的菜单。我也在使用PHP来使事情变得更复杂。任何人都可以指导我如何实现这一目标吗？

Answer 1

使用属性style="display:none"修改两个下拉列表。在您的javascript函数中，您将根据SelectedIndex注册一个事件，您可以从中选择要删除style="display:none"的下拉元素。

Answer 2

这应该做的工作：

$("#drop").change(function() {
    if( $('#drop option:selected').val() == "A") {
        //Do what you want
    }
    else if ( $('#drop option:selected').val() == "B") {
        //Do what you want
    }
});

我不知道你在js中的等级，如果你需要更多解释，请告诉我。

Answer 3

Here's使用本机JavaScript操作类的示例。它可能更干净，但它显示了如何再次检查存在哪些类以设置CSS行为。

var cont = document.body.appendChild(document.createElement('div'));
cont.className = 'row';


for (var i = 0; i < 3; i++ ) {
    var menuitem = cont.appendChild(document.createElement('div'));
        menuitem.className = 'col';
    var internal = menuitem.appendChild(document.createElement('div'));
        internal.appendChild(document.createTextNode('item'+ (i + 1)));

(internal.attachEvent) ?
    internal.attachEvent('onclick', function () {
        for (var j = 0; j < cont.children.length; j++){
            if (cont.children[j].className === 'col active') {
                cont.children[j].className = 'col';
            }
        };
        this.parentElement.className = 'col active';
    }) : 
    internal.addEventListener('click', function () {
        for (var j = 0; j < cont.children.length; j++){
            if (cont.children[j].className === 'col active') {
                cont.children[j].className = 'col';
            }
        };
        this.parentElement.className = 'col active';
    }, false);
};

HTML。隐藏/显示下拉菜单，具体取决于是否在另一个下拉菜单中选择了一个选项

3 个答案: