Esta documentação foi arquivada e não está sendo atualizada.

Como: Add to ASP.NET Servidor Web Controles Events Script Client

Você pode adicionar script de cliente a controles em uma página Web ASP.NET declarativamente, como você faria para elementos HTML.Como alternativa, você pode adicionar eventos de script de cliente a um controle de servidor Web do ASP.NET, por meio de programação, o que é útil se o evento ou o código basear-se nas informações que estão disponíveis somente em tempo de execução.

ObservaçãoObservação:

Você pode fazer referência a controles pela identificação no script de cliente. Para mais informações, consulte Script de cliente em páginas da Web do ASP.NET.

Adicionar um evento onclick de script de cliente aos botões requer um procedimento especial, que é apresentado posteriormente neste tópico.

ObservaçãoObservação:

O suporte para script de cliente depende do navegador.Por exemplo, Internet Explorer, Mozilla e navegadores para dispositivos móveis podem fornecer diferentes tipos de suporte para script de cliente.

Para adicionar um manipulador de eventos de cliente a um controle de servidor ASP.NET declarativamente

  • Na marcação do controle, adicione um atributo para o evento, por exemplo, onmouseover ou onkeyup.Para o valor do atributo, adicione o script de cliente que você deseja executar.

    ObservaçãoObservação:

    Sempre adicione um ponto-e-vírgula (;) após o script de cliente no atributo.Isso é necessário para que, se o ASP.NET gerar script de cliente para o controle (por exemplo, se a propriedade AutoPostBack do controle estiver definida como true), seu código será executado primeiro.

    Quaisquer pares atributo/valor na marcação do controle que não correspondem às propriedades do controle são passados para o navegador como se estivessem.

    O exemplo de código a seguir mostra uma página Web do ASP.NET que inclui script de cliente para alterar a cor do texto do botão quando o usuário passar o mouse sobre ele.

    <%@ Page Language="VB"%>
    <html>
    <head runat="server">
      <title>Untitled Page</title>
      <script type="text/javascript">
          var previousColor;
          function MakeRed()
          {
              previousColor = window.event.srcElement.style.color;
              window.event.srcElement.style.color = "#FF0000";
          }
          function RestoreColor()
          {
              window.event.srcElement.style.color = previousColor;
          }
      </script>
    </head>
    <body>
      <form id="form1" runat="server">
        <asp:button id="Button1" runat="server"
          text="Button1"
            onmouseover="MakeRed();"onmouseout="RestoreColor();" />
      </form>
    </body>
    </html>
    
<%@ Page Language="C#" %>
<html>
<head runat="server">
  <title>Untitled Page</title>
  <script type="text/javascript">
      var previousColor;
      function MakeRed()
      {
          previousColor = window.event.srcElement.style.color;
          window.event.srcElement.style.color = "#FF0000";
      }
      function RestoreColor()
      {
          window.event.srcElement.style.color = previousColor;
      }
  </script>
</head>
<body>
  <form id="form1" runat="server">
  <asp:button id="Button1" runat="server" 
    text="Button1" 
      onmouseover="MakeRed();"onmouseout="RestoreColor();" />
  </form>
</body>
</html>

Para adicionar um manipulador de eventos de cliente para um controle ASP.NET por meio de programação

  • No evento Init ou Load da página, chame o método Add da coleção Attributes do controle.

    O exemplo de código a seguir mostra como adicionar script de cliente a um controle TextBox.O script de cliente exibe o tamanho do texto no controle TextBox.O script assume que a página contém um elemento span chamado spanCounter.

    Protected Page_Load(ByVal sender As Object, _
        ByVal e As System.EventArgs)
        Dim displayControlName As String = "spanCounter"
        TextBox1.Attributes.Add("onkeyup", _
            displayControlName & ".innerText=this.value.length;")
    End Sub
    
protected void Page_Load(object sender, EventArgs e)
{
    String displayControlName = "spanCounter";
    TextBox1.Attributes.Add("onkeyup", displayControlName + 
        ".innerText=this.value.length;");
}

Para adicionar um evento de clique de cliente a um controle de botão

  • No controle do botão (controles Button, LinkButton e ImageButton), defina a propriedade OnClientClick como o script de cliente a executar.

    O exemplo de código a seguir mostra como adicionar um evento de clique de script de cliente para um controle Button.

    <%@ Page Language="VB" %>
    <script runat="server">
        Sub Button1_Click(ByVal sender As Object, _
            ByVal e As System.EventArgs)
            Label1.Text = "Server click handler called."
        End Sub
    </script>
    
    <body>
      <form id="form1" runat="server">
        <asp:Button ID="Button1" Runat="server" 
          OnClick="Button1_Click" 
            OnClientClick="return confirm('Ready to submit.')" 
            Text="Test Client Click" />
        <br />
        <asp:Label ID="Label1" Runat="server" text="" />
      </form>
    </body>
    </html>
    
<%@ Page Language="C#" %>
<script runat="server">
    protected void Button1_Click(Object sender, EventArgs e)
    {
        Label1.Text = "Server click handler called.";
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
  <form id="form1" runat="server">
    <asp:Button ID="Button1" Runat="server" 
      OnClick="Button1_Click" 
        OnClientClick="return confirm('Ready to submit.')" 
        Text="Test Client Click" />
    <br />
    <asp:Label ID="Label1" Runat="server" text="" />
  </form>
</body>
</html>

Script de cliente pode executar funções potencialmente mal intencionadas no computador cliente.Seja extremamente cuidadoso com o script que você escreve em uma página, especialmente se o script for gerado ou alterado em resposta a entrada do usuário. Para mais informações, consulte Visão Geral de Scripts Maliciosos.

Mostrar: