JQuery只返回一个值

时间:2016-10-22 13:53:01

标签: javascript php jquery html ajax

这是我的第一个stackoverflow问题。 我正在研究简单的ajax代码。我的想法是我有多个复选框。单击复选框时,jquery脚本需要取复制按钮的值并发送ajax请求。

问题是我按下的任何复选框值都是321,这是第一个复选框值。我是javascript的新手很抱歉,如果问题是愚蠢的或什么的。谢谢。                                       

        </title>
    </head>
    <body>

    <form action="">
    <input id="321" class="checkbox" type="checkbox" name="vehicle" value="321" />I have a car<br>
      <input id="123" class="checkbox" type="checkbox" name="vehicle" value="123" /> I have a bike<br>

      <input type="submit" value="Submit"/>
    </form>

    <span></span>

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        var sum = 0;
        $(".checkbox").change(function(){
            if($(this).is(':checked')) {
                var str = $(".checkbox").attr("value");
                $.get("demo.php?item="+str, function(data, status){
                    sum = sum + parseInt(data);
                    $("span").html(sum);
                });
            }else{
            var str = $(".checkbox").attr("value");
            $.get("demo.php?item="+str, function(data, status){
                sum = sum - parseInt(data);
                $("span").html(sum);
            });
        }
    });

});

</body>
</html>

1 个答案:

答案 0 :(得分:1)

$(".checkbox").attr("value")

应用于具有复选框类的所有元素,并导致您遇到的行为。你需要使用

$(this).val()

$(this).attr("value")

代替。另外,为了加快脚本速度,在change内,您可以像这样计算$(this)

var that = $(this);

以后使用that.val()that.is(':checked')