选择选项将强制选择其他选项

例如，如果选择id="chocolate-yes"或id="vanilla-yes"的选项，则也会选择带有id="icecreamcone-yes"的选项。选择选项将强制选择其他选项

正如您在下图中看到的，当您选择id="chocolate-yes"的选项时，<select id="icecreamcone">将被禁用。

如果未选择id="chocolate-yes"和id="vanilla-yes"，则不会禁用id="icecreamcone-no"的选项。

为了把它在简单的话：你总是需要有一个蛋卷冰淇淋，如果你想添加香草或巧克力冰淇淋，用洒除外:)

任何人知道一个Javascript可以做到这一点？

注1：id="sprinkles-yes"选项不会影响id="icecreamcone-yes"。
注意2：在选择id="vanilla-yes"或id="chocolate-yes"之前，仍需要选择id="icecreamcone-yes"。
注3：id名称不能更改，也不能为元素添加更多属性。
注意4：不能使用jQuery。

<ul id="icecream" style="list-style:none;line-height:30px;"> 
    <li> 
    <select id="icecreamcone"> 
     <option value="addicecreamcone">Would you like an ice cream cone?</option> 
     <option id="icecreamcone-yes" value="yes">Yes</option> 
     <option id="icecreamcone-no" value="no">No thanks</option> 
    </select> 
    </li> 
    <li> 
    <select id="vanilla"> 
     <option value="addvanilla">Would you like to add vanilla ice cream?</option> 
     <option id="vanilla-yes" value="yes">Yes</option> 
     <option id="vanilla-no" value="no">No thanks</option> 
    </select> 
    </li> 
    <li> 
    <select id="chocolate"> 
     <option value="addchocolate">Would you like to add chocolate ice cream?</option> 
     <option id="chocolate-yes" value="yes">Yes</option> 
     <option id="chocolate-no" value="no">No thanks</option> 
    </select> 
    </li> 
    <li> 
    <select id="sprinkles"> 
     <option value="addsprinkles">Would you like to add sprinkles on top?</option> 
     <option id="sprinkles-yes" value="yes">Yes</option> 
     <option id="sprinkles-no" value="no">No thanks</option> 
    </select> 
    </li> 
</ul>

来源

2012-11-08 Macchiato

使用jQuery

$('#icecreamcone').change(function() { 
alert("There has been a change"); 
//Use Javascript to disable. 
});

替换#icecreamcone与你正在寻找监测变化事件的元素的选择ID。

唯一需要注意的是禁用的表单元素不会提交，因此将该值存储在隐藏的输入标记中以提交它们。

来源

2012-11-08 14:20:59 Idiot211

好了，这样的事情可能会帮助您：

$("select").change(function() { 
    if ($("#vanilla").val() == "yes" || $("#chocolate").val() == "yes") 
     $("#icecreamcone").val("yes"); 
    else 
     $("#icecreamcone").val("addicecreamcone"); 
});

，您可以尝试here

来源

2012-11-08 14:45:34 andrux

伟大的作品，除了两个问题：不能使用jQuery在这个例子中，我不能选择“冰淇淋 - 是“，然后选择”香草 - 是“或”巧克力 - 是“。 – Macchiato

选择选项将强制选择其他选项

回答

相关问题