javascript 如何在选中的 html CheckBox 上打开 jQuery 对话框(使用 jQuery)?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19181634/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 14:41:10  来源:igfitidea点击:

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

javascriptjqueryjquery-uicheckbox

提问by Temp Expt

I want to popup a jQuery dialog when a html checkbox is checked. I'm using following code. But it's not working.

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

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

And the html is as below:

html如下:

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

Please help me.

请帮我。

Also I want to uncheck the checkBox when popup will be closed. Checkbox is in a jQuery popup box. I need to open another popup on checkbox checked.

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

Thanks in Advance.

提前致谢。

采纳答案by Irvin Dominin

You can use openand closemethods and closeevent.

您可以使用openclose方法和close事件。

Code:

代码:

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

Demo: http://jsfiddle.net/IrvinDominin/V9zMx/

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

回答by Sergio

Try this, also closing if the checkbox is clicked again.

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

$(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');
        }
    });
});

Demo here

演示在这里