Using variables with jQuery

Question

So I'm building a slider control from a dropdown list.

The jQuery UI example uses javascript that looks like this:

<script>
$(function() {
    var select = $( "#minbeds" );
    var slider = $( "<div id='slider'></div>" ).insertAfter( select ).slider({
    min: 1,
    max: 6,
    range: "min",
    value: select[ 0 ].selectedIndex + 1,
    slide: function( event, ui ) {
    select[ 0 ].selectedIndex = ui.value - 1;
    }
});
$( "#minbeds" ).change(function() {
    slider.slider( "value", this.selectedIndex + 1 );
    });
});
</script>

I'm basing my work on that, but trying to make it more dynamic - I'm writing a function to turn select elements into sliders. I can guarantee that the select elements have options in sorted order, but it isn't clear to me how I can take the var $select ($ sign added for distinction as a container of a jQuery object) and use it with other jQuery selectors.

For example, how do I use a variable holding a jQuery object to find the first child of it? I know something like the following will work:

var selected = $('#select-element option:selected').val();
$('#foo').slider({ value: selected });

It isn't clear to me, however, how I can take the variable $select and get the option:selected off of it (or option:first-child, options:last-child, etc).

In short, I am wondering how I mix typical jQuery selectors with variables that hold jQuery objects.

For $('#select-element option:selected') you can do $('#select-element').find('option:selected') so if you have a variable for select element then $select.find('option:selected') — Huangism
– Huangism, Commented Aug 20, 2014 at 15:38

Dave · Accepted Answer · 2014-08-20 15:32:13Z

1

Pointy is right, use .find().

Specifically:

var selected = $select.find('option:selected').val();

answered Aug 20, 2014 at 15:32

Dave

11k3 gold badges45 silver badges54 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Using variables with jQuery

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related