在 jquery UI 模式对话框中检查复选框状态答案

【问题标题】：check checkbox status in jquery UI modal dialog在 jquery UI 模式对话框中检查复选框状态
【发布时间】：2012-05-02 06:36:17
【问题描述】：

我有一个带有复选框的模态 jQuery UI 对话框：

            $dialog = $('<div id="formContainer"></div>')
                        .html('<div>some text</div><input id="accept_cb" type="checkbox" checked="checked"/> Uncheck this box to disable.<br />')
                        .dialog({
                                autoOpen: false,
                                title: 'Title ',
                                modal: true,
                                buttons: {
                                    "Close": function() {
                                        checkboxHandler();
                                    },
                                    Cancel: function() {
                                        $( this ).dialog( "close" );
                                    }
                                }
                            });


            function checkboxHandler(){
                if ($('#accept_cb').is(':checked'))
                {
                  alert('checked');
                }else{
                  alert('not checked');
                }
            }

当我第一次打开对话框时，一切正常，并提醒正确的检查状态。但是当我第二次返回时，无论是第一次，状态都保持“已检查”或“未检查”。我需要改变什么？

我也尝试了().attr 和().prop，结果相同。

【问题讨论】：

缺少引用：.html(
一些文本

标签： jquery jquery-ui checkbox dialog modal-dialog

【解决方案1】：

关闭对话不会破坏它。尽管您没有提及您是如何打开对话的，但我想您只是再次运行此代码。如果是这样，您正在创建所有这些元素的副本。当您在一个页面上有 2 个具有相同 ID 的元素时，您的浏览器将始终返回第一个，因此您的“无论是第一次”。

要么.remove()“关闭”处理程序中的对话，要么不要每次都重新创建内容。

【讨论】：

这已经解决了，我删除了 $dialog 而不是 $('#formContainer')。谢谢。

【解决方案2】：

在您的代码中，我看到一个语法错误。注意你的'。另请参阅 jQuery API 了解有关复选框的更多信息 http://api.jquery.com/checked-selector/

【讨论】：

【解决方案3】：

简单的解决方案。您需要为复选框使用类并将选择器与 :last 一起使用，因为 ui 模态对话框复制了此元素。

function checkboxHandler(){
   if ($('.accept_cb:last').is(':checked'))
   {
      alert('checked');
   }else{
      alert('not checked');
   }
}

【讨论】：