JQuery: comment masquer un DIV lorsque la zone de texte est floue?

C'est le code que j'ai:JQuery: comment masquer un DIV lorsque la zone de texte est floue?

<body> 
    <form id="form1" runat="server"> 
    <div> 
     <asp:TextBox ID="txtInsertComments" CssClass="expanding" runat="server" AutoPostBack="false" TextMode="MultiLine"></asp:TextBox> 
    </div> 
     <div id="commands"> 
      <table cellpadding="0" cellspacing="0" width="400px" id="tblCommands"> 
       <tr> 
        <td style="width: 50%; text-align: center;"> 
         <asp:LinkButton ID="lnbInsertRes" runat="server" CommandName="Insert" Font-Underline="false">Insert</asp:LinkButton> 
        </td> 
        <td style="width: 50%; text-align: center;"> 
         <asp:LinkButton ID="lnbCancelRes" runat="server" CommandName="Cancel" Font-Underline="false">Cancel</asp:LinkButton> 
        </td> 
       </tr> 
      </table> 
     </div> 
    </form> 
</body> 
    <script type="text/javascript"> 
     $(function() 
     { 
      $("#commands").hide("normal"); 

      $("textarea[id$=txtInsertComments]").focus(function() 
      { 
       $("#commands").show("normal"); 
      }); 

     }); 
    </script> 
</html>

Tout d'abord, lorsque cette page est en cours de téléchargement, la div #command est chargé très rapide puis disparaît. J'ai besoin de la div pour rester caché jusqu'à ce que le contrôle de textbox txtInsertComments soit cliqué ou obtienne le foyer. Deuxièmement, lorsque l'utilisateur clique sur hors de la zone de texte txtInsertComments ou que la zone de texte a perdu le focus, la commande div # est toujours présente et non masquée.

Toute aide est appréciée.

Source

2009-11-30 Chuck

Vous pouvez utiliser les CSS pour cacher la DIV #command jusqu'à ce que vous voulez montrer:

<div id="commands" style="display:none">

Ensuite, utilisez flou/focus pour afficher/masquer les #commandes DIV:

$('#txtInsertComments').blur(function() { 
    $("#commands").hide() 
}).focus(function() { 
    $("#commands").show() 
});

Source

2009-11-30 16:58:37

Définir initialement display:none sur #commandes.

<div id="commands" style="display:none">....

Pour perdre de vue, il suffit d'utiliser l'événement flou:

$(el).blur(function(){...});

Source

2009-11-30 16:56:45

$(document).ready(function() { 
    $('#<%=txtInsertComments.ClientID%>').blur(function() 
     { $("#commands").hide() }); 
    $('#<%=txtInsertComments.ClientID%>').focus(function() 
     { $("#commands").show() }); 
});

Source

2009-11-30 16:57:48 Jimmeh

Merci beaucoup pour votre réponse rapide. Ça marche! – Chuck

D'accord, le code que vous m'avez montré m'aide pour la page de base d'asp.net. Quelqu'un a-t-il déjà utilisé jQuery pour les contrôles ListView imbriqués? Cette même jQuery ne fonctionne pas avec les contrôles ListView imbriqués. – Chuck

merci beaucoup;) ce code est parfait;) – Schewns

JQuery: comment masquer un DIV lorsque la zone de texte est floue?

Répondre

Questions connexes