开发者

Obtain the number of the item in an options menu?

I'm using .val() in jQuery to retain the value of an options menu onChange.

How would I retain the number (as in as it is ordered) of the item in the drop down using jQuery?

<select>
     <option>  //option 1
     <option>  //option 2
</select>

Here is what I have set up now:

<select id="start_month" onChange="getMonthDay()">
         <option>Jan</option>
         <option>Feb</option>
         <option>March</option>
         <option>April</option>
<select>

Using,

function getMonthDa开发者_如何学Goy()
{

$('#start_month').val()
}

I can get whatever value is selected, but my question is how do I get the Number down of this value in the markup? For March, I would want 3.. and so on


Can you reformulate your question better? I'm still lost in what do you want.

But, nevertheless here is how <select> works in jQuery

<select id="selection">
  <option value="val_1">value 1</option>
  <option value="val_2">value 2</option>
</select>

$("#selection").val() will give you val_1 or val_2 depending on witch item is currently selected.

If you want to go through all options and check the selected on, you can use

$("#selection option:selected").val();

or itenerate through all <option>'s

$("#selection option").each(function() {

    if( $(this).is(":selected") ) {

        var v = $(this).val();

    }

});

If you want to retain all options you can easily clone them or assign them as data, if you want to keep those values throughout the pages, use Local Database or Cookies to persist the data.


To answer your question after your update:

First: Why don't you have:

<select id="start_month" onChange="getMonthDay()">
    <option value="1">Jan</option>
    <option value="2">Feb</option>
    <option value="3">March</option>
    <option value="4">April</option>
<select>

And use the value of the selected item?

Second: Just use what I wrote above and itenerate through the options

$("#start_month option").each(function(index, element) {

    if( $(this).is(":selected") ) {

        // get index position, remember to add 1 as arrays start at 0
        var n = index;

        // break each
        return false;

    }

});


You'd get a list of the <option> elements, find the selected one, and use index:

var $opts = $('#start_month option');
var zero_based_index = $opts.index($opts.filter(':selected'));

Demo: http://jsfiddle.net/ambiguous/HyukW/

Just add 1 if you want a one-based index.


I made something like this,with zero based key ;

<select id='deneme'>
    <option>Val1</option>
    <option>Val2</option>
    <option>Val3</option>
    <option>Val4</option>
</select>

$('#deneme').change(function(){
        $.each( $('#deneme').children('option'),function(key,value){
            if($(this).is(':selected'))
                alert(key)
        })
})

u can check from here http://jsfiddle.net/8JZCw/


No need for any iteration here, let jQuery do that for you, just get the selected index and increment...

$('#start_month option:selected').index() + 1
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜