Изменение набора кнопок jQuery - PullRequest
Новая
       17

Изменение набора кнопок jQuery

6 голосов
/ 21 марта 2011

Я новичок в jQuery и подумал, что буду использовать его кнопочный набор вместо некоторых радиокнопок в моем приложении.Документация здесь: http://jqueryui.com/demos/button/#radio

Как добавить обработчик к событию, когда набор кнопок меняет значение?

Вот фрагмент кода, который я пробовал: 

$('input.tod_quant').change(function() {
    alert('TEST');
});

А потом в HTML: 

<span id="tod_quant" class="buttonset">
        <input type="radio" id="tod_quant5" name="tod_quant" value="5" /><label for="tod_quant5">5-Minute</label>
        <input type="radio" id="tod_quant60" name="tod_quant" checked="checked" value="60" /><label for="tod_quant60">60-Minute</label>
        </span>

Событие «изменение» никогда не срабатывает.Есть ли вообще событие изменения?Как я могу это сделать?Кроме того, есть ли документация с примером?http://jqueryui.com имеет множество примеров, и ни один, который я могу найти, не показывает каких-либо событий.Я полагаю, что мое незнание jQuery не совсем помогает ситуации.

Любая помощь будет наиболее ценной.Спасибо.

Ответы [ 4 ]

9 голосов
/ 21 марта 2011

Для кнопок в jQuery-UI нет события change.

Вы должны прослушать событие изменения или щелчка основных переключателей:

http://jsfiddle.net/marcosfromero/kr2Xc/

6 голосов
/ 21 марта 2011

Ха! Задача решена. Я взломал весь этот день, и это было прямо передо мной.

Мне просто нужно было изменить способ выбора элемента следующим образом: 

$('#tod_quant')
2 голосов
/ 02 июля 2012

У меня была эта проблема, и я решил ее следующим образом: я создал обработчик событий для меток: 

$('.label-class').click(LabelClicked);
$('.input-class').change(InputChanged);
function LabelClicked() {
    var input = $('#' + $(this).attr('for'));
    if(input) 
        input.trigger('change'); 
    return true;
}
function InputChanged() {
    //do your work with this event
}

Другого пути нет!Я протестировал несколько способов и, наконец, решил сделать это

0 голосов
/ 21 марта 2011 
    <script>
    $(function() {
        $( "#radio" ).buttonset();
    });
    </script>



<div class="demo">

<form>
    <div id="radio">
        <input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
        <input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
        <input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
    </div>
</form>

используйте этот код и проверьте, включаете ли вы файлы jquery.js и jqueryui.js.

...