运行功能onclick of disabled复选框

时间:2012-06-23 05:23:32

标签: javascript jquery

我有一个复选框,我不希望用户直接访问。我希望他们接受一些条款。要做到这一点,我希望他们能够点击禁用的复选框,打开这个包含条款的迷你弹出窗口(不选中复选框),以便读者可以阅读并接受它们。一旦他们接受了弹出窗口,弹出窗口将关闭,复选框将被选中。我遇到的问题是我无法想象运行一个禁用复选框的功能。

4 个答案:

答案 0 :(得分:4)

处理对已禁用元素的点击确实很棘手......但我认为无论如何这都不是理想的用户体验。如果禁用了某个复选框,则某些用户会看到该内容并且不愿意尝试单击它。相反,请考虑使用 preventDefault 拦截click事件并将其用于您自己的目的。

<input type='checkbox' id="cb" name="cb" />

$(document).ready(function() {
    $("#cb").click(function(e) {
        // cancel click event so that checkbox remains unchecked
        e.preventDefault();

        // display popup here, then manually check the checkbox if needed
    }
});

答案 1 :(得分:1)

$('#chk').click(function () {
            if (confirm('Accept')) {
                $(this).attr('checked', 'checked');
            }
            else {
                 $(this).attr('checked', false); }
        });

答案 2 :(得分:0)

禁用的复选框可能无法正确处理点击事件,并且会显示为“已禁用”。

但是,你可以试试这个:

  • 如果显示弹出窗口,则向要存储的复选框添加属性(例如data-popup =“0”)
  • 处理复选框
  • 上的onclick事件
  • 如果显示弹出窗口(data-popup =“1”),则返回true以允许用来检查它
  • 如果未显示弹出窗口(data-popup =“0”),则阻止默认行为,设置data-popup =“1”并显示带有条款和条件的弹出窗口

根据弹出窗口的设计,另一个改进可能是在弹出窗口中添加一个新复选框,当用户阅读条款和条件时,他可以直接从弹出窗口接受条款和条件。如果您这样做,则需要在弹出窗口中的复选框上处理点击事件,并自动选中页面上的复选框。

答案 3 :(得分:0)

@dbaseman

这是我的代码。 看一下。在这里,我得到了关于div的警报,但没有关闭复选框。

<html>
<head>
<script type="text/javascript" src="jQuery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("#checkbox, #hello").click(function(){

       alert("hello");
    });
});
</script>
</head>

<body>
<div id="checkbox">
    <p> hello</p>
<input type="checkbox" id="hello" disabled="disabled"  />
</div> 
</body>
</html>