我试图使用.hide()隐藏一个下拉框中的几个选项.这在Firefox和chrome中工作得很好,但它在IE和Safari中不起作用.我的原始代码更复杂,但我把它缩小了.
我尝试了几种组合,没有任何工作.
.hide()的作品,但不是因为某些原因在选项标签内的东西.
有人可以帮帮我吗？这让我很开心非常感谢您抽出时间帮助！
这是我的jscript：
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".wrapper1").hide();
});
</script>
这是HTML：
<label for="prodName">Product Name:</label>
<input type="text" name="prodName" /><br />
<label for="candy">Candy:</label>
<select name="candy" id="candy">
<option value="0" class="blank" selected="selected"></option><!-- PHP and JS validators should not allow "0" here. User should be prompted to select something. -->
<option value="1" class="wrapper1">Hide this 1</option>
<option value="2" class="wrapper1">Hide this 2</option>
<option value="3" class="wrapper2">Show this 1</option>
</select><br />
解决方法
这将工作..更改.show到.showOption和.hideOption.
然而,这仍然是一个愚蠢的IE,因为在firefox你可以使它隐藏一个选择的选项.所以如果显示“选择一个”并且被隐藏. Firefox仍然会说“选择一个”.
然而,这仍然是一个愚蠢的IE,因为在firefox你可以使它隐藏一个选择的选项.所以如果显示“选择一个”并且被隐藏. Firefox仍然会说“选择一个”.
$.fn.showOption = function() {
this.each(function() {
if( this.tagName == "OPTION" ) {
var opt = this;
if( $(this).parent().get(0).tagName == "SPAN" ) {
var span = $(this).parent().get(0);
$(span).replaceWith(opt);
$(span).remove();
}
opt.disabled = false;
$(opt).show();
}
});
return this;
}
$.fn.hideOption = function() {
this.each(function() {
if( this.tagName == "OPTION" ) {
var opt = this;
if( $(this).parent().get(0).tagName == "SPAN" ) {
var span = $(this).parent().get(0);
$(span).hide();
} else {
$(opt).wrap("span").hide();
}
opt.disabled = true;
}
});
return this;
}
