2010-07-14 6 views
6

Ho creato un modulo Web semplice, contenente una casella di testo e un pulsante. Ho catturato l'evento onblur della casella di testo.evento di clic sul pulsante perso a causa della casella di avviso nella casella di testo evento 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> 

Quando entro un certo valore nella casella di testo e fare clic sul pulsante, quindi l'evento onblur di testo si verifica, ma il clic del pulsante non lo fa. E, quando rimuovo la finestra di avviso dalla funzione js, allora funziona bene. Alcuni come il clic del pulsante è perso l'evento. Penso che sia dovuto alla casella di avviso. Qualche idea sul perché sia ​​così?

risposta

6

Un "clic" di un pulsante ha due parti, il mouse giù e il mouse su. Quando si preme il mouse sul pulsante, si ottiene la messa a fuoco, sfocando la casella di testo e attivando l'avviso. Poiché le finestre di avviso sono modali, interrompono tutte le attività sulla pagina in modo che il pulsante non rilevi il mouse e il clic non venga completato.

Potrebbe essere possibile aggirare il problema utilizzando un timer all'interno dell'evento sfocatura, e l'annullamento che il timer all'interno dell'evento MouseDown del pulsante:

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

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

c'è qualche workarround per questo? –

+0

@Vinod T.Patil: non proprio. L'unica "soluzione" sarebbe attendere fino al completamento del clic o evitare l'uso di "alert". –

+0

one way is to, chiamare esplicitamente clic del pulsante, come document.getElementById ("Button1"). Click() ;, dopo l'avviso. Funziona. Ma, è ok per tale applicazione di esempio, in pratica ci possono essere altre caselle di testo sul modulo e in tal caso non vorrei che il clic del pulsante venga attivato immediatamente dopo che ho lasciato la prima casella di testo. –

1

Scrivete una funzione e dare una chiamata a funzionare da del pulsante MouseDown e onClick Eventi

2

got it .... ho ottenuto che funziona ...

Aggiunta chiamata esplicita al click del pulsante in onblur evento non è corretto, perché onblur evento può accadere in qualsiasi momento, come quando noi spostare in un'altra casella di testo o fare clic in qualsiasi punto del modulo ecc. (come menzionato da Corey Ogburn nei commenti sopra). Pertanto, il clic del pulsante verrebbe generato anche se l'utente non ha effettivamente fatto clic sul pulsante.

Quindi, nell'evento onblur dovrebbe esserci un modo per identificare che si stia facendo clic sul pulsante di invio e se è quindi si attiva il clic del pulsante in modo esplicito. Ecco il codice,

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

Qui, su evento MouseDown del pulsante, che avviene prima onblur della casella di testo, ho impostato un valore di segnalare clicked e onblur della casella di testo, ora posso identificare se il pulsante è stato cliccato o meno.

Ma, anche questo è solo un workarround e OK per tale esempio di applicazione :). È meno fattibile in pratica perché ci possono essere più pulsanti di invio di questo tipo sul webform e dovremo fare clic sull'evento di tutti questi pulsanti (collegamenti, ecc.) Nell'evento onblur della casella di testo. Questo perché l'utente può fare clic su uno dei pulsanti di invio (collegamenti, ecc.) Dopo aver inserito i dati nella casella di testo e l'avviso/conferma in onblur sta per sopprimere tali eventi di clic. Spero di essere chiaro.

Divertiti !!!