Javascript 如何在元素的默认行为之后运行click函数_Javascript_Jquery_Html

Javascript 如何在元素的默认行为之后运行click函数

javascript jquery html

Javascript 如何在元素的默认行为之后运行click函数,javascript,jquery,html,Javascript,Jquery,Html,我的代码无标题文件 $（函数（）{ $（“body”）。在（“click”、“.mes_sel”函数（）上{ 如果（$（“.mes_sel:checked”）.length==0）{ 警报（“已检查”）； } else警报（“未检查”）； }); }); 当文本框未选中时，它会发出选中警报，因为onclick在选中复选框之前运行。如何在选中/取消选中输入后运行click事件 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transition

我的代码


无标题文件
$（函数（）{
$（“body”）。在（“click”、“.mes_sel”函数（）上{
如果（$（“.mes_sel:checked”）.length==0）{
警报（“已检查”）；
}
else警报（“未检查”）；
});
});

当文本框未选中时，它会发出选中警报，因为onclick在选中复选框之前运行。如何在选中/取消选中输入后运行click事件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script src="jquery.js"></script>
<script>
$(function(){
    $("body").on("click",".mes_sel",function(){
        if($(".mes_sel:checked").length==0){
            alert("Checked");
        }
        else alert("Not Checked");
    });
});
</script></head>
<body>
<input type="checkbox" class="mes_sel">
</body>
</html>

使用

更改：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<script src="jquery.js"></script>
<script>
$(function(){
    $("body").on("click",".mes_sel",function(){
        if($(".mes_sel:checked").length==0){
            alert("Checked");
        }
        else alert("Not Checked");
    });
});
</script></head>
<body>
<input type="checkbox" class="mes_sel">
</body>
</html>

试试这个：
$(function(){
    $(".mes_sel").on("change", function(){
        if($(this).is(':checked')){
            alert("Checked");
        } else {
            alert("Not Checked");
        }
    });
});

试试以下方法：
$(function(){
    $(".mes_sel").on("change", function(){
        if($(this).is(':checked')){
            alert("Checked");
        } else {
            alert("Not Checked");
        }
    });
});

不久前我遇到了这个问题-我还发现不同的浏览器处理这个问题的方式不同。如果我没记错的话，Chrome是最坏的罪犯
这不一定是最好的解决方案，但您可以为每个复选框附加一个自定义属性，比如“isChecked”，然后将函数基于此属性，如下所示：
$("body").on("click", ".mes_sel", function() {
    if ($(this).is(":checked")) {
        alert("Checked");
    }
    else alert("Not Checked");
});

正如我所说的，这不是最好的解决方案，因为您必须手动翻转“isChecked”属性，以便与复选框的实际选中值保持一致，但如果没有更优雅的方法对您有效，那么它将起作用
如果您想要这方面的示例，请查看以下JSFIDLE：

这将常规单选按钮变为“可切换”单选按钮-我被迫使用此自定义属性方法，因为浏览器执行onclick
事件的方式不同。
我不久前遇到过这个问题-我还发现不同的浏览器处理这个问题的方式不同。如果我没记错的话，Chrome是最坏的罪犯
这不一定是最好的解决方案，但您可以为每个复选框附加一个自定义属性，比如“isChecked”，然后将函数基于此属性，如下所示：
$("body").on("click", ".mes_sel", function() {
    if ($(this).is(":checked")) {
        alert("Checked");
    }
    else alert("Not Checked");
});

正如我所说的，这不是最好的解决方案，因为您必须手动翻转“isChecked”属性，以便与复选框的实际选中值保持一致，但如果没有更优雅的方法对您有效，那么它将起作用
如果您想要这方面的示例，请查看以下JSFIDLE：

这将常规单选按钮变为“可切换”单选按钮-我被迫使用此自定义属性方法，因为浏览器在单击事件时执行onclick
事件的方式不同。
请帮助我决定哪一个更好您的或任何策略。请帮助我决定哪一个更好您的或任何策略