单选按钮选中和取消选中 onclick 并发送数据答案

【问题标题】：Radio button check and uncheck onclick and send data单选按钮选中和取消选中 onclick 并发送数据
【发布时间】：2018-09-04 04:37:53
【问题描述】：

我正在尝试通过带有单选按钮的 ajax onclick 发送数据。如果单击并选中单选按钮，则在数据库中设置值 1。如果单选按钮已被选中，但单击以取消选中它，则将值 0 发送到数据库。我正在使用的代码发送值 onclick 并检查单选按钮，但不会取消选中，因此不会将值发送到数据库。请帮忙。

<input type="radio" name="home['. $row["id"].']" id="'. $row["id"].'">

<script>
$(document).ready(function(){
    $('input[type="radio"]').click(function(){

        var checked = $(this).prop('checked');

        if (checked != 'checked') {
            $(this).prop('checked', true);
            var id = $(this).attr('id');
            $.ajax({
                 url:"updateaddress.php",
                 method:"POST",
                 data:{home:"1",id:id,},
            });
        } else if (checked == 'checked') {
            $(this).prop('checked', false);
            var id = $(this).attr('id');
            $.ajax({
                 url:"updateaddress.php",
                 method:"POST",
                 data:{home:"0",id:id,},
        });

        }
    });                           
});
</script>

【问题讨论】：

使用checkbox代替单选按钮
print_r($_POST); 中有什么内容？有你的价值吗？如果是，则比具有存储到数据库逻辑的东西。
您需要使用checkbox 或者您需要有多个单选按钮。
重要的是支持 sn-p 编辑器仅用于运行基于 JS 的代码它无法理解您的 name="home['.$row["id"].']" id= "'.$row["id"].'" 单选按钮。确保在该位置写入正确的值或字符串
@DilipBorad 也不是 Ajax。

标签： javascript php jquery ajax radio

【解决方案1】：

一个复选框和

$('input[type="checkbox"]').on("click", function(){ 
  $.post("updateaddress.php",{home:this.checked,id:this.id});
});

就是你所需要的

如果您必须使用收音机，请查看此

How to Check/Uncheck single radio button

$('input[type="radio"]').on("click", function(){ 
  $.post("updateaddress.php",{home:this.checked,id:this.id});
  this.checked=!this.checked;
});

【讨论】：

所以我尝试了这个： $('input[type="checkbox"]').on("click", function(){ $.post("updateaddress.php",{home: this.checked,id:this.id}); });也有效，不得不承认，我确实喜欢代码的简单性。感谢@mplungjan

【解决方案2】：

当有多个选项并且用户应该只选中一个选项时使用单选按钮。所以，当已选中单选按钮时，用户不能取消选中。你明确地创建一个 onclick 监听器并更改单选按钮状态。但它不是可取的。您可以在 onchange 事件中使用复选框。

$(checkEle).on("change",function(){
  var status = $(this).prop("checked");
  sendStatus(status);
}

【讨论】：

【解决方案3】：

<input type="radio" name="home['. $row["id"].']" id="'. $row["id"].'">

<script>
$(document).ready(function(){
    $('input[type="radio"]').click(function(){
        var data = {home:"0",id:$(this).attr("id")};
        if ($(this).is(":checked")) {
            data = {home:"1",id:$(this).attr("id")};
        }
         $.ajax({
                 url:"updateaddress.php",
                 method:"POST",
                 data:data,
         });

    });                           
});
</script>

您可以使用此脚本。只需检查单选按钮是否被选中并相应地发送您的值。

【讨论】：

重复我自己是什么意思？ @mplungjan
只有一个$.ajax({ url:"updateaddress.php", method:"POST", data:{home:this.value,id:this.id,},
更新了我的答案。 @mplungjan
你还在重复自己。为什么要定义数据 TWICE - 看看它有多简单：stackoverflow.com/a/49484822/295783
感谢大家的帮助。我选择了@SmitRaval，因为它对我来说是最容易实现的。我按照建议选择了复选框。按预期工作！