复选框 - 使用 jQuery 和 MySQL 选中或取消选中

Posted 2023-03-05

【中文标题】复选框 - 使用 jQuery 和 MySQL 选中或取消选中

【英文标题】：checkbox - checked or unchecked with jQuery and MySQL

【发布时间】：2011-08-26 10:19:14

【问题描述】：

我目前正在创建一个必须可以选中/取消选中复选框的系统。每次更改状态时，我都需要 jQuery 对页面进行 AJAX 调用，从而更新数据库。

我该怎么做？

【参考方案1】：

检测复选框是否被选中：

if ( $('#id').is(':checked') )  

这可以在由“onchange”事件触发的函数中执行。

function checkCheckboxState() 

    if ( $('#id').is(':checked') )  

        // execute AJAX request here

    

【参考方案2】：

例如你可以这样做：

首先你必须查看复选框是否被选中：

$("#yourSelector").live("click", function()
        var id = parseInt($(this).val(), 10);
        if($(this).is(":checked")) 
            // checkbox is checked -> do something
         else 
            // checkbox is not checked -> do something different
        
);

您可以通过 Ajax 加载特定内容：

$.ajax(
                type: "POST",
                dataType: "xml",
                url: "path/to/file.php",
                data: "function=loadContent&id=" + id,
                success: function(xml) 
                    // success function is called when data came back
                    // for example: get your content and display it on your site
                
);

【讨论】：

请记住，在为变量赋值之前，您需要在某处声明变量id。而且，如果使用parseInt()，总是值得指定radix：parseInt($(this).val(), 10);

【参考方案3】：

你坚持哪一点？你可能应该有这样的东西......

$('#myCheckbox').click(function() 
    var checked = $(this).is(':checked');

    $.ajax(
        type: "POST",
        url: myUrl,
        data:  checked : checked ,
        success: function(data) 
            alert('it worked');
        ,
        error: function() 
            alert('it broke');
        ,
        complete: function() 
            alert('it completed');
        
    );
);

【讨论】：

好吧，我被卡住了。我读过使用带有复选框的单击是不好的。当我在单击复选框时尝试执行警报时，它不会发出任何警报 - 所以我不确定它是否正常工作：s

【参考方案4】：

大概是这样的吧？

$('.checkbox').click(function ()
    var val = $(this).is(':checked');
    $.load('url_here',status:val);
);

【参考方案5】：

<input type="checkbox" name="foo" value="bar" class="checkIt"/>

<script type="text/javascript">
    $('.checkIt').bind('click', function() 
        if($(this).is(":checked")) 
            // checkbox is checked
         else 
            // checkbox is not checked
        
    );
</script>

您现在可以拥有多个复选框。