Question

我有一个关于禁用或删除HTML元素的问题。

我有3组选择。第一组（1,2,3），第二组（a，b，c）第三组（4,5,6）。这是逻辑：

如果我在第一组中选择（1），它将在第二组消失时使（b和c）选项和（4,5）消失
如果我在第一组中选择（2），它将使（a）选项在第二组消失，并且（6）在第三组被禁用。
如果我在第一组选择（3），它将使第二组的所有选项都被禁用，而不是消失，并使（5,6）消失。

任何人都可以给我一些代码示例，或者至少通过点击事件或选择事件来禁用和消除HTML元素。

Answer 1

你应该研究jQuery，一个超级简单的例子是这样的：

<div class="hideMe"> 
some stuff
</div>

然后在你的脚本中：

$(document).ready(function() {

    $('.hideMe').click(function() {
          //Do some stuff here 
     });

});

Answer 2

我将举例说明如何在列表中进行第二点操作。由此您应该能够为其他人调整解决方案。我假设这三个选择框包含ID first，second和third。

$("#first").change(function() {
    //Reset so that all options are enabled and visible.
    $("option").prop("disabled", false).show();
    //Do different things depending on what value is selected.
    switch($(this).val())
    {
        case "1":
            //Implement some code here.
            break;
        case "2":
            //Hide a option on the second select.
            $("#second option[value=a]").hide();
            //Disable 6 option on third select.
            $("#third option[value=6]").prop("disabled", true);
            break;
        case "3":
            //Implement some code here.
            break;
    }
});

请注意，此代码依赖于为选项明确设置的value属性。您还可以根据列表中的位置选择选项，例如#third option:eq(2)作为第三个列表中的第三个选项。

您可能还想添加一些逻辑，以便在删除或禁用选项时选择该选项，而是选择其他选项。

Fiddle.

如何使用Javascript禁用或禁用html元素

2 个答案: