Comment paramétrer l'interface utilisateur de jQuery par programmation?

Question

je remarqué qu'il est possible de définir la valeur d'un curseur jQuery UI de la manière suivante:

$("#mySlider").slider("value", 42); 

Cela déclenche les gestionnaires d'événements attachés au curseur comme prévu.

Maintenant, j'essaie de faire le même tour en utilisant un bouton (bascule). Il ne semble pas être une bonne façon de le faire dans le API. Je pourrais juste manquer quelque chose de simple.

J'ai essayé ce qui suit à aucun résultat:

$("#myButton").button().click(); 

Toute idée comment gérer que dans ce cas sont les bienvenus. Notez qu'il serait génial de trouver une solution qui s'applique également à un ensemble de boutons.

Modifier

Notez que j'ai besoin de cette fonctionnalité particulière pour simuler l'utilisateur. Voici un code pour illustrer la question mieux:

function toggleBrushValue(hotkey, attributeName) { 
    shortcut.add(hotkey, function(e) { 
     //XXX: the missing part 
     $("#" + attributeName).<something?>; 
    }); 
} 

function increaseBrushValue(hotkey, attributeName) { 
    shortcut.add(hotkey, function(e) { 
     var currentSize = $("#" + attributeName).slider("value"); 

     $("#" + attributeName).slider("value", currentSize + 1); 
    }); 
} 

Answer 1

Il a fallu du temps, mais j'ai finalement trouvé un moyen de contourner le problème. :) Voici ma solution:

var $toggle = $("#" + attributeName); 

$toggle.attr("checked", !$toggle.attr("checked")).button("refresh"); 

Comme jQuery UI permet de basculer obtenir leur valeur initiale via « cochée », j'ai décidé d'utiliser pour mon avantage. "refresh" s'assure que son état visuel soit également mis à jour.

Answer 2

Essayez d'utiliser .toggle(), comme ce qui suit:

$("#myButton").toggle(
    function() { 
     $("#mySlider").slider("value", 42); 
    }, 
    function() { 
     // something else... 
    } 
); 

Il fonctionne sur un bouton-set trop puisque vous fournissez le sélecteur correct. Par exemple:

<input id="myButton" ...> 
<input id="myButton" ...> 
<input id="myButton" ...> 

$('#myButton').toggle() seront exécutés pour chacun des éléments ci-dessus. En outre, si vous devez interagir avec le bouton depuis la fonction elle-même, utilisez this ou $(this). Par exemple:

$("#myButton").toggle(
    function() { 
     alert($(this).attr('id')); 
    }, 
    function() { 
     alert($(this).attr('name')); 
    } 
);