选择下拉项时显示元素

Question

我有个问题。 我正在尝试为Genesis Framework创建主题。 我遇到一个元素的麻烦。

我有两个下拉列表。 但是，我只希望从“第一个”下拉列表中选择“特定项目”时出现第二个。 考虑这是第一个下拉列表。

<select name="jquery_box" id="jquery_box"> <option value="">None</option> <option value="fancybox">Fancybox</option> <option value="colorbox">Colorbox</option> </select>

现在，我希望出现第二个下拉列表，但仅当我在第一个溺水菜单中选择了“第三个”选项时才可以。 “彩盒”

我正在用PHP做某事，它也可以工作，但不能实时工作。 仅当我选择第三个选项保存设置并刷新页面时，它才起作用。 我需要一些JavaScript解决方案，以便在选择带有value =“ colorbox”的第三个选项时出现，并且在选择了另一个选项时消失。

拜托，如果您能帮助我，我将非常感谢。

Answer 1

您可以这样：

$('#jquery_box').change(function() {
    if(this.value == "colorbox") {
        $('#second_select').show();
    } else {
        $('#second_select').hide();
    }
});

小提琴演示

或使用.toggle()缩短上述代码：

$('#jquery_box').change(function () {
    $('#second_select').toggle(this.value == "colorbox");
});

小提琴演示