如何在复选框选中/取消选中事件上发送发布请求 [英] how to send a post request on checkbox check/uncheck event

问题描述

我有4个复选框

  <input type="checkbox" name="1" id="1" data-toggle="toggle" data-onstyle="default"  data-width="500%" >
  <input type="checkbox" name="2" id="2" data-toggle="toggle" data-onstyle="default"  data-width="500%" >
  <input type="checkbox" name="3" id="3" data-toggle="toggle" data-onstyle="default"  data-width="500%" >
  <input type="checkbox" name="4" id="4" data-toggle="toggle" data-onstyle="default"  data-width="500%" >

我想让某人选中"复选框ajax发送该复选框的ID，而{0,1}取决于是否选中，然后1，如果未选中0则通过post asap对其php脚本进行选中或未选中

i want if some one "check" a check box ajax send the id of that check box and {0,1} depend on if checked then 1 , if unchecked 0 to a php script via post asap its checked or unchecked

 <?php
    if($_POST['id'] && $_POST['state'])
    {
    $id = $_POST['id'];
    $state= $_POST['state'];

    print $id;
    print $state;
    }
    ?>

类似这样的东西.

if checbox1 == checked:
       post(checkbox1[id],1)
if(checkbox1== unchecked)
       post(checkbox1[id],0)

我该怎么做，

推荐答案

在项目的根目录中将其另存为ajax.php.运行它并打开浏览器控制台以查看结果:

Save this as ajax.php in the root of your project. Run it and open the browser console to see the results:

<?php
    if(!empty($_SERVER['HTTP_X_REQUESTED_WITH']) && strtolower($_SERVER['HTTP_X_REQUESTED_WITH']) == 'xmlhttprequest') {
        var_dump($_POST['id']);
        var_dump($_POST['value']);
    } else {
?>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="1" id="1" data-toggle="toggle" data-onstyle="default"  data-width="500%" >
<input type="checkbox" name="2" id="2" data-toggle="toggle" data-onstyle="default"  data-width="500%" >
<input type="checkbox" name="3" id="3" data-toggle="toggle" data-onstyle="default"  data-width="500%" >
<input type="checkbox" name="4" id="4" data-toggle="toggle" data-onstyle="default"  data-width="500%" >

<script>
    $('input[type="checkbox"]').on('click', function(){

        var data = {};
        data.id = $(this).attr('id');
        data.value = $(this).is(':checked') ? 1 : 0;

        console.log(data);

        $.ajax({
            type: "POST",
            url: "/ajax.php",
            data: data,
        }).done(function(data) {
                console.log(data);
        });
    });

</script>

<?php } ?>

结果如下:

这篇关于如何在复选框选中/取消选中事件上发送发布请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！