2010-07-14 9 views
6

Ich habe ein einfaches Webformular erstellt, das ein Textfeld und eine Schaltfläche enthält. Ich habe das onblur-Ereignis des Textfelds erfasst.Button Klick Ereignis verloren wegen der Alarmbox im Textfeld onblur Ereignis

<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> 

Wenn ich einen Wert in Textfeld eingeben und auf die Schaltfläche klicken, dann das onblur Ereignis von Textbox auftritt, aber die Onclick der Taste nicht. Und wenn ich die Alarmbox von der js Funktion entferne, funktioniert es gut. Einiges, wie das Knopfklicken Ereignis ist, ist verloren. Ich denke, es liegt an der Alarmbox. Irgendeine Idee warum ist das so?

Antwort

6

Ein "Klick" einer Schaltfläche hat zwei Teile, die Maus nach unten und die Maus nach oben. Wenn Sie mit der Maus auf die Schaltfläche klicken, wird der Fokus erhöht - das Textfeld wird unscharf und der Alarm wird ausgelöst. Da Warnungsdialoge modal sind, stoppen sie alle Aktivitäten auf der Seite, sodass die Schaltfläche die Maus nicht erkennt und Ihr Klick nicht abgeschlossen wird.

Es könnte möglich sein, um Ihr Problem zu arbeiten, um einen Timer in der Unschärfe-Ereignis verwenden, und Abbrechen, dass Timer innerhalb des mousedown--Ereignis der Schaltfläche:

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

function onButtonMouseDown() 
{ 
    clearTimeout(timer); 
} 
+0

Gibt es dafür ein Workarround? –

+0

@Vinod T.Patil: nicht wirklich. Der einzige "Workaround" wäre, zu warten, bis der Klick abgeschlossen ist oder die Verwendung von "alert" zu vermeiden. –

+0

eine Möglichkeit ist, klicken Sie explizit auf Schaltfläche klicken, wie document.getElementById ("Button1"). Klicken Sie auf(); nach Alert. Es klappt. Aber es ist in Ordnung für eine solche Beispielanwendung, in der Praxis kann es andere Textfelder auf dem Formular geben und in diesem Fall würde ich nicht wollen, dass Button-Klick sofort ausgelöst wird, nachdem ich das erste Textfeld verlassen habe. –

1

Schreiben Sie eine Funktion und rufen Sie von funktionieren Schaltfläche mousedown- und onClick Events

2

Verstanden .... ich habe es funktioniert ...

expliziten Aufruf der Klick der Schaltfläche Hinzufügen in onblur Ereignis nicht korrekt ist, weil onblur Ereignis kann jederzeit passieren, wie wenn wir Bewegen Sie sich in ein anderes Textfeld oder klicken Sie irgendwo in das Formular usw. (wie von Corey Ogburn in den obigen Kommentaren erwähnt). Der Klick auf die Schaltfläche würde also ausgelöst, obwohl der Benutzer nicht auf die Schaltfläche geklickt hat.

Also, in Onblur-Ereignis sollte es eine Möglichkeit geben, zu identifizieren, dass das Senden geklickt wird, und wenn es dann ist, feuern Sie den Button explizit klicken. Hier ist der Code,

<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> 

Hier auf mousedown- Ereignis der Schaltfläche, die vor onblur des Textfeldes auf, ich habe einen Wert Flagge clicked und in onblur der Textbox gesetzt, jetzt kann ich Identifizieren Sie, ob auf die Schaltfläche geklickt wird oder nicht.

Aber, wieder ist dies nur ein Workarround und OK für solche Beispielanwendung :). Es ist in der Praxis weniger praktikabel, da es mehr solcher Submit-Buttons auf dem Webformular geben kann und wir Click Events aller Buttons (Links etc.) im Onblur-Event der Textbox auslösen müssen. Der Grund hierfür ist, dass der Benutzer nach dem Eingeben von Daten in das Textfeld auf eine der Übergabeschaltflächen (Links usw.) klicken kann, und alarm/confirm in onblur wird diese Klickereignisse unterdrücken. Hoffe ich bin klar.

Viel Spaß !!!