为什么第一次点击时不显示此警报？

Question

我创建了一个按钮。当我点击按钮时，我希望它运行一个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"); 
       } 
      }); 
     }); 
    }); 
} 

logoutt.php

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

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

Answer 1

您正在绑定内联事件处理程序内的点击处理程序，因此当第一次按下该按钮时会附加事件处理程序。所以它第二次运作。

摆脱内联点击处理程序。只是绑定使用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"); 
      } 
     }); 
    }); 
}); 

Answer 2

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

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

从HTML除去这一部分，在JavaScript中移除环绕文件准备处理功能。

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