你好Stack Overflow社区
我在一个ASP.NET应用程序上工作,在我的ASPX页面上有一个按钮。我尝试在出现confirmBox后,通过setbox函数中的JavaScript触发它的click事件,提示用户"是“或”否“。
下面是我的代码片段:
<asp:Button ID="myButton" runat="server" Text="Click Me" OnClientClick="return showConfirmBox();" OnClick="myButton_Click" />
<script type="text/javascript">
var isButtonClicked = false;
function showConfirmBox() {
if (!isButtonClicked) {
setTimeout(function() {
if (confirm('Are you sure you want to proceed?')) {
isButtonClicked = true; // Set the flag to true to prevent further clicks
document.getElementById('<%= myButton.ClientID %>').click();
} else {
// Handle the case when the user clicks 'no'
}
}, 1000);
}
// Prevent the button click event from executing immediately
return false;
}
</script>
当然!这里是更新的Stack Overflow问题,包括所有细节:
标题:防止JavaScript中确认框提示后重复执行ASP.NET按钮单击事件
产品描述:
你好Stack Overflow社区
我在一个ASP.NET应用程序上工作,在我的ASPX页面上有一个按钮。我尝试在出现confirmBox后,通过setbox函数中的JavaScript触发它的click事件,提示用户"是“或”否“。
下面是我的代码片段:
<asp:Button ID="myButton" runat="server" Text="Click Me" OnClientClick="return showConfirmBox();" OnClick="myButton_Click" />
<script type="text/javascript">
var isButtonClicked = false;
function showConfirmBox() {
if (!isButtonClicked) {
setTimeout(function() {
if (confirm('Are you sure you want to proceed?')) {
isButtonClicked = true; // Set the flag to true to prevent further clicks
document.getElementById('<%= myButton.ClientID %>').click();
} else {
// Handle the case when the user clicks 'no'
}
}, 1000);
}
// Prevent the button click event from executing immediately
return false;
}
</script>
在此设置中,单击按钮时会触发showConfirmBox()
函数。但是,即使在showConfirmBox函数中将标志isButtonClicked设置为true之后,按钮单击事件仍会继续重复执行。我想防止按钮单击事件在服务器上处理后再次触发。我如何才能做到这一点?
我已经尝试检查isButtonClicked标志并在OnClientClick属性中返回false,但问题仍然存在。
任何关于如何防止在confirmBox提示后重复执行按钮单击事件的建议或建议都将非常感谢。
谢谢您的帮助!
1条答案
按热度按时间llmtgqce1#
好吧,只是不清楚为什么一些超时或计时器问题被引入这个问题。
这里的目标是弹出一个确认对话框,如果用户点击“ok”,那么我们允许服务器端按钮事件代码运行(并且还希望在服务器端代码完成之前防止额外的点击)。
以上的一切都是相当容易的。但是,引入计时器事件表明您可能希望关闭对话框,或者在给定时间后自动关闭。
由于不清楚这里引入计时器的概念是什么(或为什么),因此我们必须假设“可能”用户希望或不希望对话框在给定时间后自动关闭。
然而,不管上面说的是什么,防止按钮再次被点击的简单解决方案(至少在服务器端代码完成之前)是用客户端代码隐藏按钮。
这种方法的优点在于,当服务器端代码完成时,不需要客户端代码来重新显示按钮(页面刷新将自动为我们完成此操作)。
所以,代码可以这样工作:
标示:
这个测试的代码是这样的:
结果是这样的:
因此,这里的简单方法是隐藏按钮,因此用户不能再次单击按钮,或重复多次。当然,在服务器端代码运行之后,按钮将重新出现。在你的文章中从来没有明确过,一旦服务器端代码完成,那么按钮是否会重新显示。上面的示例假设您希望在服务器端代码完成后重新显示按钮。因此,当服务器端代码运行时,用户不能再次单击按钮,因此在服务器端代码运行时不会发生多次单击。但是,代码完成后,用户可以再次单击该按钮。
此外,一定要跟进并询问对话框是否会在给定时间后自动关闭。既然您使用的是jQuery,那么我建议在这种情况下引入一个jQuery.UI对话框。