Как сделать так, чтобы флажок запускал функцию? - PullRequest
2 голосов
/ 03 апреля 2009

У меня есть флажок внутри

Мой вопрос: как я могу заставить флажок запускать функцию, когда он отмечен или не отмечен щелчком по нему или по его ярлыку.

Спасибо.

Ответы [ 5 ]

6 голосов
/ 03 апреля 2009

Предполагая, что вам не нужно причудливое решение ASP / JQuery, просто присоединение функции к onClick самого флажка должно работать нормально.

(Конечно, вам нужно проверить текущее состояние флажка в функции, если вы хотите, чтобы функция велась по-разному в зависимости от того, установлен флажок или нет.)

3 голосов
/ 04 апреля 2009

Как говорит "Electrons_Ahoy", вы должны иметь возможность просто прикрепить обработчик onclick к элементу checkbox. Этот обработчик также должен вызываться, когда пользователь нажимает на метку вместо флажка.

HTML:

<label><input type="checkbox" id="myCheckbox" />My Checkbox</label>

JavaScript:

document.getElementById("myCheckbox").onclick = function() {
    if (this.checked) {
        alert("Checkbox was checked.");
    }
    else {
        alert("Checkbox wasn't checked.");
    }
};

Приведенный выше код работает правильно в Safari 4 и Firefox 3 (я не уверен, как он будет работать в IE).

Steve

1 голос
/ 04 апреля 2009

Спасибо за все ваши ответы.

@ Electrons_Ahoy и @Steve: Вы туго. Моя проблема заключалась в том, что я поставил флажок внутри лаба, поэтому я сделал следующее: Я взял флажок за пределами метки, поставил триггер onclick только на флажок, и он работает нормально.

Я также выяснил, почему trgger сработал дважды, когда флажок был внутри метки, а триггер onclick был на метке: Это произошло потому, что когда я щелкнул ярлык, имитировался щелчок на флажке, а флажок, находящийся внутри ярлыка, имитировал щелчок на ярлыке, duuuuuhhh :)

1 голос
/ 04 апреля 2009

не уверен, если использовать Prototype вариант для вас, но если так, вы бы сделали это таким образом (предполагается, что Prototype 1.6. Код, написанный для более ранних версий, будет немного отличаться):

HTML:

<label><input type="checkbox" id="myCheckbox" />My Checkbox</label>

JS:

$('myCheckbox').observe('click', function(cbox)
    {
        var cbox = $('myCheckbox');
        //do work in here.
        //cbox is the DOM element that represents your checkbox
    }
);

Делать это таким образом немного приятнее, чем «голый» подход JS (на мой взгляд), и это тоже немного безопаснее.

0 голосов
/ 03 апреля 2009

Возможно, вам нужно включить свойство autopostback:

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.checkbox.autopostback.aspx

           <asp:CheckBox id="checkbox1" runat="server"
                AutoPostBack="True"
                Text="Include 8.6% sales tax"
                TextAlign="Right"
                OnCheckedChanged="Check_Clicked"/>
...