javascript - 为什么选中复选框时会显示不正确的数据值?

标签 javascript

为什么选中复选框时会显示不正确的数据值?a?

首先,加载页面index.php,它会显示All,就可以了。

但是当您选中复选框Red时,它将显示AllRed

为什么不只显示红色

index.php

<script src="http://code.jquery.com/jquery-1.7.2.js"></script>
<script>
$("#f_id").submit(send_data_requests());
</script>

<form method="post" id="f_id" action="Javascript:void(0);" >
    <input type="checkbox" id="all_color" name="all_color" value="All" onclick="send_data_requests()" checked >All<br>
    <input type="checkbox" id="color_red" name="color_red" value="Red" onclick="send_data_requests()">Red<br>
    <input type="checkbox" id="color_blue" name="color_blue" value="Blue" onclick="send_data_requests()">Blue<br>
</form>

<div id="data_areas">

<script type="text/javascript">
$(window).load(function(){
$('#all_color').click(function () {   
     $(this).prop("checked", "checked");
     $('input:checkbox').not(this).prop('checked', !this.checked);           
 });

$("#color_red").click(function() {
    $("#all_color").prop('checked', false);
});

$("#color_blue").click(function() {
    $("#all_color").prop('checked', false);
});

});

</script>

<script>
function send_data_requests()
    {
        $('#data_areas').hide();
        $.ajax
            (
                {
                    url: 'datas.php',
                    type: 'POST',
                    data: $('#f_id').serialize(),
                    cache: false,
                    success: function(data)
                        {
                            $('#data_areas').show();
                            $('#data_areas').html(data);
                        }
                }
            );
        return false;
    }
// on load page call function code //
$(document).ready(send_data_requests());
</script>

数据.php

<?php
echo $_POST[all_color];
echo "<BR>";
echo $_POST[color_red];
echo "<BR>";
echo $_POST[color_blue];
?>

最佳答案

尝试 $('#all_color').removeAttr('checked');

而不是$("#all_color").prop('checked', false);

fiddle .

出于某种原因(我也想知道*),prop 方法不会从复选框中删除“checked”属性,即使它取消选中它。

编辑: *看起来像this给出解释

关于javascript - 为什么选中复选框时会显示不正确的数据值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25848135/

相关文章:

javascript - 如何在执行悬停功能之前添加等待时间

javascript - 如何通过jquery触发器触发超链接?

javascript - 如何以图表的形式展示系统生成的结果

javascript - ChartJS Canvas 在 IE、Safari 和 Firefox 中不显示 rgba 颜色

javascript - 使用 anchor 名称的 jQuery 目录插件

javascript - v-for 循环项目不会立即在 Vue 中更新

javascript - 如何使用 Javascript 使某些内容在页面上缓慢显示?

javascript - 使用reduce和Promises在Nightmare js中循环

javascript - 从数据库中删除后,Vue.js $remove 不删除元素

javascript - 如何同步读取node.js中的行?