Jquery：选中或取消选中复选框时无法显示加载相应的页面答案

【问题标题】：Jquery: unable to show load the respective pages while checking or unchecking the checkboxJquery：选中或取消选中复选框时无法显示加载相应的页面
【发布时间】：2013-03-22 06:29:42
【问题描述】：

我有一个复选框。我想根据复选框checked 和uncheck 状态调用两个不同的php 页面。

但下面的代码只是调用检查过的 php 页面。可能是什么原因？

     <script type="text/javascript">
     $(function()
     {
     $('input[id^="test"]').on('click',function()
       {
         if ($('input[id^="test"]').checked)//when users click to on checkbox to check
         {

           $.ajax({
               url: "updatestatus.php?id="+$(this).val()+"&status=1",
               success: function(data){ 
                alert('Successfully updated...');
               }
             });
     } 
     else//when users uncheck the checkbox
       {    $.ajax({
               url: "updatestatus.php?id="+$(this).val()+"&status=2",
               success: function(data){
                 alert("uncheckde...");
               }
             });
        } 
        });
    });
         </script>

在页面中

<?php //checkbox in a while loop

            echo " <input type='checkbox' id='test' value='".$row['id']."'/> ";
         ?>

【问题讨论】：

使用更改事件而不是点击
另外，尝试使用$('input[id^="test"]').is(':checked') 作为条件。
@karaxuna 我已更改，但仍然存在问题。它只调用第二个 ajax 函数。如果我选中或取消选中我的复选框
@TiesonT。是的解决了.. $('input[id^="test"]').is(':checked') 并将 click 更改为 change
@TiesonT。如您在评论中所说，回答我的问题。我需要接受你的回答

标签： php javascript jquery

【解决方案1】：

这样试试

$(function()
     {
     $('input[id^="test"]').on('click',function()
       {
         if ($(this).attr("checked") == "checked")//when users click to on checkbox to check
         {

           $.ajax({
               url: "updatestatus.php?id="+$(this).val()+"&status=1",
               success: function(data){ 
                alert('Successfully updated...');
               }
             });
     } 
     else//when users uncheck the checkbox
       {    $.ajax({
               url: "updatestatus.php?id="+$(this).val()+"&status=2",
               success: function(data){
                 alert("uncheckde...");
               }
             });
        } 
        });
    });

【讨论】：

最好考虑一下 Tieson 的笔记

【解决方案2】：

检查是否已检查无效。请改用.is(':checked') 方法。

$(document).ready(function() {
    $('input[name=cbx]').change(function() {
        if ($(this).is(':checked')) {
            alert('Checked');
        } else {
            alert('Not Checked');
        }
    });
});

【讨论】：

【解决方案3】：

根据要求：

尝试使用$('input[id^="test"]').is(':checked') 作为条件。您还可以使用$(this) 来引用触发事件的特定复选框。所以，这里是你的代码清理了一下：

<script>
    $(function() {
        $('input[id^="test"]').on('click',function(e) {
            if ($(this).is(':checked') {
                $.ajax({
                    url: "updatestatus.php?id="+$(this).val()+"&status=1",
                    success: function(data){ 
                        alert('Successfully updated...');
                    }
                });
            } 
            else {    
                $.ajax({
                    url: "updatestatus.php?id="+$(this).val()+"&status=2",
                    success: function(data){
                        alert("uncheckde...");
                    }
                });
            } 
        });
    });
</script>

我要做的另一项更改是为您的复选框分配一个类，并将其作为目标而不是使用“开始于”选择器（因为并非每个浏览器都支持它）。

【讨论】：