Hide select option in IE, Safari using jQuery
HTML:
<select id="foo">
<option value="visible">visible</option>
<option value="thing" id="lol">fsljs</option>
</select>
<button id="blah">hide all options</button>
JQUERY:
$.fn.hideOption = function() {
this.each(function() {
$(this).wrap('<span>').hide()
});
}
$('#blah').toggle( function() {
$('select option').hideOption();
$(this).text('show the span again')
}, function() {
$('select span').showOption();
$(this).text('hide the second option')
});
$.fn.showOption = function() {
this.each(function() {
var opt = $(this).find('option').show();
$(this).replaceWith(opt)
});
}
http://fiddle.jshell.net/FAkEK/25/
<select id="foo">
<option value="visible">visible</option>
<option value="thing" id="lol">fsljs</option>
</select>
<button id="blah">hide all options</button>
JQUERY:
$.fn.hideOption = function() {
this.each(function() {
$(this).wrap('<span>').hide()
});
}
$('#blah').toggle( function() {
$('select option').hideOption();
$(this).text('show the span again')
}, function() {
$('select span').showOption();
$(this).text('hide the second option')
});
$.fn.showOption = function() {
this.each(function() {
var opt = $(this).find('option').show();
$(this).replaceWith(opt)
});
}
http://fiddle.jshell.net/FAkEK/25/
Comments
Post a Comment