Check if some attr are checked with jquery on load

Question

I would like to check if 2 specifics out of 3 options in my html select are checked on load.

Actually, my HTML :

<select name="country" id="country" tabindex="7" style="width:128px; margin-right:26px;">
            <option selected="selected" name="0">Choisir...</option>
            <option value="Canada" <?php if($pays == 'Canada'){echo "selected=selected";} ?>>Canada</option>
            <option value="États-Unis" <?php if($state == 'États-Unis'){echo "selected=selected";} ?>>États-Unis</option>
        </select>

And My jQuery is the following :

if($('#reference').attr('selected',true))
    {
        $('.showDetaillant').show();
    }

As you may see, it only check is something is "selected". By default, this is the option "Choisir...".

Want I am looking for, is to set .hide() if the option "Choisir..." is selected.

Thx

Answer 1

    <select name="country" id="country" tabindex="7" style="width:128px; margin-
        right:26px;">
             <option selected="selected" value="0">Choisir...</option>
     </select>

<script>
     $(document).ready(function () {

         if($('#country').val()=="0")
           $('.showDetaillant').show();
       });

<script>

Answer 2

You can use selectedIndex property, if you want to check the selected option on page load, you can trigger the change event on DOMReady.

$('#country').change(function(){
    if (this.selectedIndex === 0) {
        $('.showDetaillant').show();
    }
}).change();

http://jsfiddle.net/JfDZ4/

PS: Note that you are using attr as a setter which returns a jQuery object that always is valuated to true.

Answer 3

you can try the following it gives you the index of selected option

$("select#elem").get(0).selectedIndex > 0

read this How to check if selected index of dropdownlist is not 0 or -1 using jquery