单击按钮时未选中复选框答案

【问题标题】：Checkbox is not selected when click on the button单击按钮时未选中复选框
【发布时间】：2013-07-22 06:51:45
【问题描述】：

我试图在列表视图中的列表项之前获得一个复选框。当我单击“编辑”按钮时，我有一个带有列表视图的页面。列表视图在列表项之前添加了复选框，但是当我单击复选框时，页面会自动更改为上一个视图（列表视图中没有复选框）。未选中复选框。我做错了。

$('#fav').on('click', function() {
    $("#favoritesList").listview('refresh');
    fromStorage();

    $(document).on('click', '#empty', function() {
        $("#favoritesList").empty();
        localStorage.clear();
        $("#favoritesList").listview('refresh');
    });


    $(document).on('click', '#edit', function() {
        fromGetStorage();
    });
});

function fromGetStorage() {
    $("#favoritesList").empty();
    $(".ui-listview-filter").remove();
    $("#favoritesList").append('<input type="checkbox" name="all" id="select" />Select all</br>');
    for (var i = 0; i < localStorage.length; i++) {
        var url = localStorage.key(i);
        var demo = localStorage.getItem(url);
        $("#favoritesList").append('<li><div><input type="checkbox" name="check" id="check">&nbsp;<a href="' + url + '" style="text-decoration:none;color:black">' + demo + '</a></div></li>').attr('url', url);
        $("#favoritesList").listview('refresh');
        $('#select').click(function() {
            if ($("#select").is(':checked')) {
                $("#check").prop("checked", true);
            }
            else {
                $("#check").prop("checked", false);
            }

            $("#favoritesList").listview('refresh');
}

【问题讨论】：

制作 js 小提琴，有助于为您提供答案
hmm..但是如果我为此做了一个小提琴，我已经把整个东西都放在了小提琴中
无法理解您要说什么...希望您不想在 jsfiddle 中显示所有内容，如果是这种情况，请尝试使用其他模型解决问题，否则会更难来解决你的问题。尽量让你遇到问题的部分避免不必要的事情
$("#check").prop("checked", false).checkboxradio('refresh');
@Omar 当我点击复选框时，页面突然变为以前的视图，我的意思是正常的列表视图（没有复选框）。

标签： jquery html listview jquery-mobile checkbox

【解决方案1】：

正如 Thirumalai 所说，提供 jsfiddle 会有很大帮助。

我认为您的问题可能是事件冒泡与 jquery mobile 的工作方式相结合。 jQuery mobile 可能会处理列表视图，当它在里面找到<a> 时，它会自动将其视为项目的“链接部分”。当您点击复选框时，除了选中的复选框外，还会调用更高级别的点击处理程序。

我会尝试将点击处理程序分配给复选框并停止事件的冒泡 (http://api.jquery.com/event.stopPropagation/)，因此它不会冒泡到更高级别并且不会打开链接。

$("#check").click(function(event){
    event.stopPropagation();
});

如果您不需要坚持使用您的代码，我建议您以与本文类似的方式构建 html：

Checkbox in ListView with Jquery mobile

还有 jsfiddles。

祝你好运。

【讨论】：