0

例如，如果您选择带有id="chocolate-yes"或id="vanilla-yes"的选项，带有 的选项id="icecreamcone-yes"也将被选中。

如下图所示，当您选择带有 的选项时id="chocolate-yes"，<select id="icecreamcone">将被禁用。

当两者id="chocolate-yes"都id="vanilla-yes"没有被选中时，选项 withid="icecreamcone-no"将不会被禁用。

用更简单的话来说：如果你想添加香草或巧克力冰淇淋，你总是需要一个冰淇淋蛋筒，除了洒水:)


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

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



<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>

4

2 回答 2

0

使用 jQuery

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

将 #icecreamcone 替换为您要监视其更改事件的元素的选择 ID。

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

于 2012-11-08T14:20:59.540 回答
0

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

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

你可以在这里试试

于 2012-11-08T14:45:34.837 回答