Why Hide/show Event Is Not Working In Safari

When the page loads I want all the dropdown option to hide. I tried this with CSS using display: none. I tried with jQuery. However none of these is working in Safari. The code wor

Solution 1:

I can confirm that Safari ignores display: none on option elements.

Your best bet is probably to disable the options rather than hiding them:

$(".product_names").val("").find("option").prop("disabled", true);

If you really want them hidden, you'll need to remove them. You can always put them back if you want to later:

var options = $(".product_names").find("option").detach();

to add them back:

options.appendTo(".product_names");