jQuery Slider ID dans l'événement Diapositive?

Question

J'utilise plusieurs curseurs jquery et je veux pouvoir utiliser une fonction pour l'événement Slide. Je n'arrive pas à comprendre comment obtenir l'ID du curseur qui appelle l'événement Diapositive.

Voici comment mon code ressemble à http://jsfiddle.net/89dxM/8/.

À l'intérieur de ma fonction SliderDisplay(), je dois trouver quel curseur appelle la fonction pour pouvoir mettre à jour le texte en conséquence. Est-ce possible?

Merci, Susan

Answer 1

La fonction de rappel est appelée à partir du contexte du curseur étant utilisé, de sorte que vous pouvez utiliser le « cette » variable pour y accéder est id:

var id = $(this).attr("id"); 

Dans votre lien code de test, utilisez ce qui suit:

function SliderDisplay(event, ui) { 
    $("#price-Powergarage").val($(this).attr("id")); 
} 

pour prendre votre exemple application à sa conclusion, ajouter un attribut supplémentaire à chaque div curseur comme ceci:

Html

<label for="price-Powergarage">Garage Spaces:</label> 
<input type="text" id="price-Powergarage"/> 
<div id="slider-Powergarage" rel="#price-Powergarage"></div> 

<label for="price-Powerdoor">Garage Doors:</label> 
<input type="text" id="price-Powerdoor"/> 
<div id="slider-Powerdoor" rel="#price-Powerdoor"></div> 

Javascript

$("#slider-Powergarage").slider({ 
    range: true, 
    min: 1, 
    max: 10, 
    values: [1, 10], 
    step: 1, 
    slide: SliderDisplay 
}); 


$("#slider-Powerdoor").slider({ 
    range: true, 
    min: 1, 
    max: 10, 
    values: [1, 10], 
    step: 1, 
    slide: SliderDisplay 
}); 

function SliderDisplay(event, ui) { 
    $($(this).attr("rel")).val("$" + ui.values[0] + " - $" + ui.values[1]); 
} 

Answer 2

Vous pouvez trouver l'entrée par ID:

function SliderDisplay(event, ui) { 
     var id = '#' + event.target.id.replace('slider','price'); 
     $(id).val("$" + ui.values[0] + " - $" + ui.values[1]); 
    }