0

I have some problem.

This is HTML document.

<input class="input" type='checkbox' id='ev_1' name='ev_1' checked='checked'/>
<label for='ev_1'>
<button class='ui-btn custom-btn' id='issue'>On</button>
</label>

This is javascript.

$("#issue").click(function(event){
    alert("!");
}

I think that alert("!"); is occur when I click button. But, not effect....

I want to show alert("!"); I need your help.

Yongchan Jo
  • 13
  • 1
  • 2

1 Answers1

0

As Omar mentioned, your button should be outside the label and your input checkbox can be inside the label:

<label for='ev_1'>
    <input class="input" type='checkbox' id='ev_1' name='ev_1' checked='checked' />On
</label>
<button class='ui-btn custom-btn' id='issue'>On</button>

Then you can have event handlers defined in the jQM pagecreate handler. To handle the checkbox, use a change event handler, and for the button a click handler:

$(document).on("pagecreate", "#page1", function () {
    $("#issue").on("click", function (event) {
        alert("Button Click");
    });

    $("#ev_1").on("change", function (event) {
        alert("Checkbox Change");
    });
});

Here is a working DEMO

ezanker
  • 24,628
  • 1
  • 20
  • 35
  • I want button in label... ^^ – Yongchan Jo Dec 03 '14 at 00:27
  • @YongchanJo, what are you trying to achieve by having the button inside label? You can do it, but clicking the button will also change the checkbox: http://jsfiddle.net/ezanker/x4r8t1fy/1/ – ezanker Dec 03 '14 at 14:14
  • Wow, Thanks for your attention. $("#issue").on("click", function (event) { alert("Button Click"); return false; }); – Yongchan Jo Dec 04 '14 at 05:49