Question

我有以下内容在更改复选框时触发。

$(document).ready(function() {
    $("#reviewed").change(function(){
        if ($('#reviewed:checked').val() !== null) {
            $.ajax({
                url: "cabinet_reviewed.php?reviewed=yes",
                cache: false,
                success: function(html){
                    $("#reviewDate").replaceWith(html);
                }
            });
         } else {
             $.ajax({
                url: "cabinet_reviewed.php?reviewed=no",
                cache: false,
                success: function(html){
                    $("#reviewDate").replaceWith(html);
                }
            });
        }
});
})

这仅适用一次。我希望看到复选框何时更改以及更改后的值是什么。

更新：我已将代码更改为以下内容（基于每个人的评论）

$(document).ready(function() {
    $("#reviewed").click(
        function() { 
            var rURL = 'cabinet_reviewed.php?reviewed=';
                if ($("#reviewed").is(":checked"))
                   rURL = rURL + "yes";
                else
                   rURL = rURL + "no";
                alert (rURL);
        $.ajax({
            url: rURL,
            cache: false,
            success: function(html){
                $("#reviewDate").replaceWith(html);
            }
        });

    });

}）

文件cabinet_reviewed.php只是回显$ _GET ['review']的值使用此更新的代码，警报显示正确的URL，但第二次单击不会运行.ajax。我是否需要做某事以便再次运行.ajax？

Answer 1

IE中的复选框显然存在change()事件的一些错误。请尝试使用click()事件，看看它是否效果更好。

Answer 2

尝试使用!=代替!==

这也是另一种选择：

$('#reviewed').is(':checked')

以下代码在FF 3.5和IE8中始终如一：

$("#reviewed").click(
    function() { 
        if ($("#reviewed").is(":checked"))
            alert('checked'); 
        else
            alert('not checked');
    }
);

更新后：

此代码......

success: function(html){
  $("#reviewDate").replaceWith(html);
}

...正在使用从Ajax调用返回的HTML替换DOM中的ID=reviewDate元素，因此在第二次进行Ajax调用时它不再存在。

这样的事情会更简单吗？

success: function(html){
  $("#reviewDate").html(html);
}

Answer 3

您通常希望使用click事件来跟踪复选框/单选按钮中的更改。仅当新值与旧值不同时，才会触发change事件。在复选框/单选按钮中，没有初始值的方法，只有checked属性通常不是预定义的，因此需要在触发更改事件之前单击两次。

在复选框/单选按钮中，您也不希望按val()检查值，它始终相同。您更愿意使用this.checked检查已检查状态。

因此，以下内容应该有效：

$(document).ready(function() {
    $("#reviewed").click(function() {
        if (this.checked) {
            // ...
        } else {
            // ...
        }
    });
});

为什么这个if / else在我的jquery中不起作用？

3 个答案: