防止双击javascript中的按钮 [英] prevent double click on button in javascript

问题描述

<script type="text/javascript">
    $(document).ready(function () {
        $("#submit").on("click", function () {
            $(this).attr('disabled', true);
            var taskid = num;
            var loadnew = 1;
            var guessnum = $("input[name=guessnum]:checked").val();
            if (guessnum != 1 && guessnum != 2) {
                alert("You could not submit an empty answer");
                loadnew = 0;
                location.href = "/minions/peerprediction1.php";
            }
            else if (loadnew == 1) {
                finishedTask += 1;
            }
            var starttime = $("#timestart").val();
            var timecost = starttime;
            $.ajax({
                type: "post",
                url: "GameMysql.php",
                data: "taskid=" + taskid + "&guessnum=" + guessnum + "&effort=" + effort + "&finishedTask=" + finishedTask + "&time=" + timecost,
                success: function (data) {
                }
            });
        });
    });

</script>
<form>
    <a class="button" id="submit"><span>&#10003</span>Submit report</a>
</form>

我想确保具有相同答案的表单不会提交两次，并禁用该按钮，但是它确实无法正常工作.因为我单击它两次，完成的任务数增加了2我已经在这里看到答案了防止在jQuery中重复提交表单并尝试过，但仍然无法使它起作用

I want to make sure the form with same answers do not submit twice, and disable the button, but it does not truly work. For I click it twice the finished task number increased by 2 I already see the answer here Prevent double submission of forms in jQuery and tried, but still could not make it work

推荐答案

使用button元素，它将提供您所追求的功能.可以将其样式设置为看起来像锚.使其在所有浏览器中都能正常运行的问题更少了.

Use the button element, it will provide the functionality you are after. It can be styled to look like an anchor. Less issues trying to get it working as intended across all browsers.

$("#submit").on("click",function(){    
    $(this).attr('disabled', true);
    console.log('disabled');
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="button" id="submit"> <span>&#10003</span> Submit report</button>

这篇关于防止双击javascript中的按钮的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！