为什么第一次点击时不显示此警报 - Why isn't this alert displayed on first click?

Why isn't this alert displayed on first click?

本文关键字：显示第一次为什么 | 更新日期: 2024-05-04

我创建了一个按钮。当我单击该按钮时，我希望它运行PHP文件并显示警报。这是我正在尝试的：.HTML：

<button id="testid" style="height:20px; width: 50px; cursor: pointer" onclick="logoutfunc()">Logout</button>

JavaScript：

function logoutfunc() {
    $(document).ready(function() {
        $("#testid").click(function() {
            $.ajax({
                url: 'logoutt.php',
                type: 'post',
                success: function(result11) {
                    //$(location).attr('href', 'login.php');
                    alert(result11);
                },
                error: function() {
                    alert("no");
                }
            });
        });
    });
}

注销.php

<?php
$a="Hello";
echo $a;
?>

现在的问题是，当我第一次单击该按钮时，它不会显示警报。但是当我再次单击它时，它会显示两次相同的警报。当我再次单击它时，它会发出 3 次警报，依此类推。我写错了什么？

您将单击处理程序绑定到内联事件处理程序中，因此，当第一次单击按钮时，将附加事件处理程序。所以它第二次有效。

摆脱内联点击处理程序。只需使用 jQuery 绑定事件处理程序

$(document).ready(function() {
    $("#testid").click(function() {
        $.ajax({
            url: 'logoutt.php',
            type: 'post',
            success: function(result11) {
                //$(location).attr('href', 'login.php');
                alert(result11);
            },
            error: function() {
                alert("no");
            }
        });
    });
});

为什么你一次又一次地绑定同一个事件？

....onclick="logoutfunc()"...

从HTML中删除此部分，并在javascript中删除围绕文档就绪处理程序的函数。

$(document).ready(function(){
  $("#testid").click(function(){
     // your ajax code.
  });      
});