好的,所以我正在尝试根据下拉菜单的 selectedIndex 删除一个类,具体来说,我希望当有人在我的下拉菜单中选择第二个选项(selectedIndex 为 1)时出现 id=hide 的 div,如果他们选择了不同的选项。
这是我的html代码:
<div id="product-variants">
<select id="product-select" name="id">
<option value="269270508">No Charm</option>
<option value="269270608">Heart (Add $25)</option>
<option value="269270614">Horseshoe Bead (Add $25)</option>
<option value="269270666">Crystal Horseshoe (Add $25)</option>
<option value="269270692">Cowgirl Cross (Add $25)</option>
<option value="269270732">Lucky Charm (Add $35)</option>
<option value="270460652">Round (Add $25)</option>
<option value="269270562">Small Star (Add $20)</option>
<option value="269270598">Large Star (Add $25)</option>
</select>
</div>
<div id="hide" class="hidden"><form>
<input id="checkbox" type="checkbox" name="vehicle" value="Bike">Engraving?<br>
</form>
<form>
Engraving Message: <input type="text" name="engraving"><br>
</form></div>
我的脚本:
var choice = getElementById("product-select").selectedIndex;
if (choice == 1){
$('#checkbox').change(function(){
$('#hide').removeClass('hidden');
});
}
和 CSS:
.hidden {
display:none
}
以及 jfiddle 上的链接:http: //jsfiddle.net/AFrjz/2/
我一直试图解决这个问题好几个小时,但似乎无法做到。
非常感谢!