由于文本框中的警告框而丢失的按钮单击事件onblur事件

我创建了一个简单的Web窗体，其中包含一个文本框和一个按钮。我已经捕获了文本框的onblur事件。由于文本框中的警告框而丢失的按钮单击事件onblur事件

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
    <title>Untitled Page</title> 
    <script language="javascript" type="text/javascript"> 
    function onTextBoxBlur() 
    { 
     alert("On blur"); 
     return true; 
    } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <asp:TextBox ID="TextBox1" runat="server" onblur="onTextBoxBlur();"></asp:TextBox> 
    <asp:Button ID="Button1" runat="server" Text="Button" /> 
</form> 
</body> 
</html>

当我输入在文本框中输入某个值，然后单击该按钮，然后文本框的onblur事件发生，但按钮的onclick没有。而且，当我从js函数中删除警告框时，它工作正常。一些如何点击按钮是事件丢失。我认为这是由于警报框。任何想法为什么是这样？

来源

2010-07-14 Vinod T. Patil

按钮的“单击”有两部分，鼠标向下和鼠标向上。当您按下按钮时，它会获得焦点 - 模糊文本框并触发警报。由于警报对话框是模态的，因此它们会暂停页面上的所有活动，以便按钮不会检测到鼠标并且点击无法完成。

，便有可能使用定时器模糊事件中，和取消按钮的MouseDown事件内的计时器来解决您的问题：

var timer; 
function onTextBoxBlur() 
{ 
    timer = window.setTimeout(function() { alert("On blur"); }, 0); 
    return true; 
} 

function onButtonMouseDown() 
{ 
    clearTimeout(timer); 
}

来源

2010-07-14 10:49:20

有没有这方面的workarround？ – 2010-07-14 11:44:56

@Vinod T.Patil：不是。唯一的“解决方法”是等待点击完成或避免使用“alert”。 – 2010-07-14 11:52:48

一种方法是，显式调用按钮单击，如alert.getElementById（“Button1”）。click（）;, alert后。有用。但是，对于这样的示例应用程序来说，实际上在表单上可能有其他文本框，在这种情况下，我不想在离开第一个文本框后立即触发按钮单击。 – 2010-07-14 12:37:02

编写一个函数，给个电话从运作按钮的鼠标按下和的onclick事件

来源

2010-07-14 15:40:06 SachinS

明白了....我得到它的工作...

在onblur事件添加显式调用按钮的点击不正确的，因为onblur事件随时可能发生，像当我们呃移动到其他文本框或单击表格中的任何位置（如上面评论中的Corey Ogburn所述）。所以点击按钮会被触发，尽管用户并没有点击按钮。

因此，在onblur事件中，应该有一种方法来确定提交被点击，并且如果它是明确地触发按钮的点击。下面是代码，

<html xmlns="http://www.w3.org/1999/xhtml" > 
<head runat="server"> 
    <title>Untitled Page</title> 
    <script language="javascript" type="text/javascript"> 
    var clicked = 0; 

    function onTextBoxBlur() 
    { 
     alert("On blur " + clicked);  

     if(1 == clicked) 
     { 
      clicked = 0; 
      document.getElementById("Button1").click(); 
     } 

     return true; 
    } 
    function SubmitButtonClicked() 
    { 
     clicked = 1; 
    } 
    </script> 
</head> 
<body> 
    <form id="form1" runat="server" > 
    <div> 

    </div> 
    <asp:TextBox ID="TextBox1" runat="server" onfocusout="onTextBoxBlur();"></asp:TextBox> 
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox> 
    <asp:Button ID="Button1" runat="server" Text="Button" onmousedown="SubmitButtonClicked();" />  
    </form> 
</body> 
</html>

这里，按钮，这发生前的onblur文本框的的MouseDown事件中，我有一个值设置为标志clicked和的onblur文本框的，现在我可以确定按钮是否被点击。

但是，再次，这只是一个workarround和OK这样的示例应用:)。它在实际中不太可行，因为webform上可能会有更多这样的提交按钮，我们将不得不触发文本框的onblur事件中的所有按钮（链接等）的单击事件。这是因为用户可以在将数据输入到文本框后点击任何提交按钮（链接等），并在onblur中进行提醒/确认以抑制这些点击事件。希望我清楚。

Enjoy !!!

来源

2010-07-15 05:57:16

由于文本框中的警告框而丢失的按钮单击事件onblur事件

回答

相关问题