如何在元素的默认行为之后运行单击功能

how to run click function after default behaviour of a element

本文关键字：之后 运行 单击 功能 默认 元素      更新时间：2023-09-26

我的代码

<!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>

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

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

演示

试试这个：

$("body").on("click", ".mes_sel", function() {
    if ($(this).is(":checked")) {
        alert("Checked");
    }
    else alert("Not Checked");
});​

jsFiddle 示例。

不久前我遇到了这个问题 - 我还发现不同的浏览器处理这个问题的方式不同。 如果我没记错的话，Chrome 是最严重的违规者。

这不一定是最好的解决方案，但您可以将自定义属性附加到每个复选框，说"isChecked"，然后基于此属性构建函数，如下所示：

if ($("mes_sel").attr("isChecked") == "true") { ... }

就像我说的，这不是最好的解决方案，因为您必须手动翻转"isChecked"属性才能与复选框的实际选中值保持一致，但是如果没有更优雅的东西适合您，它将起作用。

如果你想要一个例子，看看这个jsFiddle：

http://jsfiddle.net/NathanFriend/GAP2j/

这会将常规单选按钮转换为"可切换"单选按钮 - 由于浏览器执行onclick事件的方式不同，我被迫使用此自定义属性方法。

相关文章：