如何打开 html 上的 jQuery 对话框 复选框选中(使用 jQuery）

How to open jQuery dialog on html CheckBox checked(using jQuery)?

本文关键字：jQuery 使用 对话框 何打开 html 上的 复选框      更新时间：2023-09-26

我想在选中 html 复选框时弹出一个 jQuery 对话框。我正在使用以下代码。但它不起作用。

$(document).ready(function () {
        $('#chkBoxHelp').click(function () {
            if ($(this).is(':checked')) {
                $("#txtAge").dialog();
            }
        });
    });

html如下：

<input type="checkbox" id="chkBoxHelp"/>
<div id="txtAge" style="display: none;">Age is something</div>

请帮助我。

我还想在弹出窗口关闭时取消选中复选框。复选框位于 jQuery 弹出框中。我需要在选中复选框时打开另一个弹出窗口。

提前谢谢。

您可以使用

open和close方法以及close事件。

法典：

$(document).ready(function () {
    $('#chkBoxHelp').click(function () {
        if ($(this).is(':checked')) {
            $("#txtAge").dialog({
                close: function () {
                    $('#chkBoxHelp').prop('checked', false);
                }
            });
        } else {
            $("#txtAge").dialog('close');
        }
    });
});

演示：http://jsfiddle.net/IrvinDominin/V9zMx/

试试这个，如果再次单击复选框，也会关闭。

$(document).ready(function () {
    var the_checkbox = $('#chkBoxHelp');
    the_checkbox.click(function () {
        if ($(this).is(':checked')) {
            $("#txtAge").dialog({
                close: function () {
                    the_checkbox.prop('checked', false);
                }
            });
        } else {
            $("#txtAge").dialog('close');
        }
    });
});

在这里演示

相关文章：