Question

假设我在页面中有4个单选按钮，单击它们中的任何一个都会触发ajax调用，以便可以将单选按钮的值保存在数据库中。

假设用户单击第一个radio按钮，那么将触发一个ajax调用，该调用将在数据库中保存值1。

虽然此调用尚未结束，但是他单击了第二个radio按钮（值为2），因此又触发了另一个ajax调用。

不能保证数据库列的值将为2（或是否存在任何值？）。因为第一次调用可能没有完成，而第二次调用可能已经完成，所以数据库列最终包含值1而不是2。

用户可以根据需要多次单击。 用什么方法将最后一次单击的单选按钮的值存储在数据库中？我认为在ajax配置中使用async:false是没有用的。代码如下：

HTML：

<input type="radio" name="options" value="1" />
<input type="radio" name="options" value="2" />
<input type="radio" name="options" value="3" />
<input type="radio" name="options" value="4" />

JS：

$("input[type=radio]").click(function(){

        $radio=$(this);
        if($radio.is(':checked')) {
            var value_found = $radio.val().trim();

            $.ajax({
                type: "POST",
                url: "my_url",
                data: "value_found=" + value_found,
                success: function (response) {

                },
                error: function (response) {

                }

            });
        }


    });

Answer 1

使其更可靠的一种方法是在单击后禁用字段，然后等待直到从ajax调用返回响应以重新启用它们。这样，您就不必担心通话打扰。

 <input class="example" type="radio" name="options" value="1" />
 <input class="example" type="radio" name="options" value="2" />
 <input class="example" type="radio" name="options" value="3" />
 <input class="example" type="radio" name="options" value="4" />



 $("input[type=radio]").click(function(){

    $('.example').prop("disabled",true);

    $radio=$(this);
    if($radio.is(':checked')) {
        var value_found = $radio.val().trim();

        $.ajax({
            type: "POST",
            url: "my_url",
            data: "value_found=" + value_found,
            success: function (response) {},
            error: function (response) {},
            complete: function(response){
                $('.example').prop("disabled",false);
            }
        });
    }

});

jQuery-是否在单击时触发Ajax以在数据库上顺序工作可靠？

1 个答案: