Javascript jquerymobile-带有折叠的列表项上的复选框-避免展开/收缩操作

我混合使用了具有可折叠格式的listview项和一个复选框来选择/取消选择该项，但是当我单击复选框时，展开/收缩容器的操作被触发

有没有办法避免它（或再次签约该项目）

标记

    <li id="item"  data-role="collapsible" data-iconpos="right" data-inset="false" data-mini="true">
    <h3>
        <div class="checkBoxLeft">
            <input type="checkbox" name="check" id="check" class="hidden-checkbox check-item" value="1" />
        </div>
        <span class="checkBoxLeftTitle">18/10 - Quarta</span>
    </h3>

10月18日-夸脱

所以我假设您使用jquery mobile来处理可折叠文件

我检查了lib如何处理正在单击的区域的扩展，并附加了一个事件，该事件将检查事件的目标是否为输入并停止传播。这是一本书

我用的是第一个

您必须在代码上使用bindFirst函数，因为jquery mobile首先附加事件，我们希望在打开内容之前停止传播

// [name] is the name of the event "click", "mouseover", .. 
// same as you'd pass it to bind()
// [fn] is the handler function
$.fn.bindFirst = function(name, fn) {
  // bind as you normally would
  // don't want to miss out on any jQuery magic
  this.on(name, fn);

  // Thanks to a comment by @Martin, adding support for
  // namespaced events too.
  this.each(function() {
    var handlers = $._data(this, 'events')[name.split('.')[0]];
    console.log(handlers);
    // take out the handler we just inserted from the end
    var handler = handlers.pop();
    // move it at the beginning
    handlers.splice(0, 0, handler);
  });
};

$(".ui-collapsible-heading").bindFirst('click', function(e) {
  var target = $(e.target);
  if ($(e.target).is('input')) {
    e.stopImmediatePropagation();
    e.stopPropagation();
  }
});

---

看到了吗：没用，还有其他想法吗？我用一个想法编辑了我的答案，这不是最好的解决方案，但我想它会用的@kakamg0奇怪的是，您的小提琴工作得很好，但在我的例子中，我使用列表项上带有可折叠的列表（考虑到您使用的是a类DIV或LI并没有什么区别）。你知道为什么不工作吗？你能用你的代码创建一个小提琴，这样我就可以查看它，更好地了解正在发生的事情吗？如果你只是把它改成

，它仍然可以