Question

我试图阻止一个单选按钮在用户点击时改变，它在使用标准jQuery时有效但是当你包含jQuery Mobile它似乎不起作用时，我还有什么需要在jQuery Mobile中做的吗？ / p>

<fieldset data-role="controlgroup"  data-type="horizontal">
        <input type="radio" name="trade-direction" id="buy" value="B" checked="checked" />
        <label for="buy">Buy</label>

        <input type="radio" name="trade-direction" id="hold" value="H"  />
        <label for="hold">Hold</label>

        <input type="radio" name="trade-direction" id="sell" value="S"  />
        <label for="sell">Sell</label>
</fieldset>

$('[name="trade-direction"]:radio').click(function(event) {
    if(!confirm("Do You Want To Change?")) {
        event.preventDefault();
    }
});

下面是jsFiddle中代码的链接。

http://jsfiddle.net/mikeu/xJaaa/

Answer 1

问题在于，使用jQuery.Mobile，受UI更改影响的元素不是输入元素。实际上，实际上根本没有点击无线电元素。单击的元素是<div class="ui-radio">。如果要绑定到无线电输入本身，则需要使用change事件，但在这种情况下它不适用于您，因为在更改已经发生后调用该函数。

你需要的是这样的东西：

// Probably a good idea to give your fieldset an ID or class

 $('fieldset').delegate('.ui-radio','click',function(event){
      if(!confirm("Do You Want To Change?")) {
        event.stopImmediatePropagation();
        event.preventDefault();
      } 
  })

event.stopImmediatePropagation()阻止.ui-radio触发点击事件到输入，event.preventDefault阻止默认操作。 stopImmediatePropagation可能没有必要，但它提供了一个额外的保证，可以在不同的浏览器中提供帮助。

jQuery Mobile点击event.preventDefault似乎不会阻止更改

1 个答案: