Compartilhar via

Demonstra Passo a passo: JScript IntelliSense

  • Artigo

Esta explicação passo a passo você usará o IntelliSense para oferecer suporte ao desenvolvimento de script de cliente em Visual Studio. IntelliSense faz referência de linguagem fácil acesso.Ao codificar, não é necessário deixar o código do editor para procurar elementos de linguagem, sistema autônomo listas de sintaxe ou parâmetro.Em vez disso, você pode permanecer no modo de edição, encontrar sistema autônomo informações necessárias e inserir elementos de linguagem diretamente em seu código. Visual Studio oferece suporte a IntelliSense para Microsoft JScript e outros idiomas ECMAScript sistema autônomo JavaScript.

Observação:

Este documento refere-se especificamente a J s cript .H owever , IntelliSense Em Visual Studio e Visual Web Developer funciona com todos os idiomas ECMAScript, que inclui o JavaScript.

Visual Studio oferece suporte a IntelliSense para os seguintes recursos:

  • Elementos DOM (documento objeto Model) DHTML.

  • Objetos intrínsecos.

  • As variáveis definidas pelo usuário, funções e objetos.

  • Referências de arquivo externo.

  • Comentários de código XML.

  • Objetos do ASP.NET AJAX.

Para obter mais informações sobre a funcionalidade IntelliSense Visual Studio, consulte Usando o IntelliSense. Para obter informações sobre o IntelliSense para JScript, consulte Visão geral do JScript IntelliSense.

Pré-requisitos

Para concluir esta explicação passo a passo, você precisa os seguintes componentes:

  • Visual Studio 2008 ou Microsoft Visual Web Developer Express Edition.

Criando o Site da Web e a Página

Para começar, você irá criar um site da Web ASP.NET e inclui suporte objetos, referências e script.Se você já criou um site da Web (por exemplo, seguindo as etapas em Demonstra Passo a passo: Criando um novo site da Web do ASP.NET), você pode usar esse site e ir para a próxima seção desta explicação passo a passo. Caso contrário, crie um novo Web site e página usando as seguintes etapas.

Para criar aplicativo Web Web

  1. Abra Visual Studio 2008 ou Microsoft Visual Web Developer Express Edition.

  2. Sobre o Arquivo menu, clicar Novo site.

    A caixa de diálogo New Web Site é exibida.

  3. Em O Visual Studio installed templates, clicar Site da Web do ASP.NET.

  4. From a Local lista, selecionar Sistema de arquivos.

  5. Na caixa ao lado para o Local lista, digite o nome da pasta onde você deseja manter as páginas do site.

    Por exemplo, digite o nome de pasta a seguir: C:\IntellisenseWebSite1

  6. From a linguagem clicarVisual Basic or Translation from VPE for Csharp Visuale, em seguida, clicar OK.

    A linguagem de programação que você selecionar será o padrão para criar o código baseado em servidor para o site da Web.Nesta explicação passo a passo, a opção não é importante, porque você estará trabalhando com o script de cliente, que é executado no navegador.

    Visual Web Developer cria a pasta e uma nova página chamada Default.aspx.Por padrão, quando uma nova página é criada, Visual Web Developer Exibe a página no modo de exibição fonte, onde você pode ver os elementos HTML da página.

Adicionando controles e código de JScript à página

Agora você irá adicionar controles e código JScript para a página padrão.aspx.

Para adicionar controles e código de JScript

  1. Clique na guia Design para alternar para o modo Design.

  2. From a Extensões AJAX guia o Caixa de ferramentas, arrastar a UpdatePanel controlar até a página.

  3. From a Padrão guia o Caixa de ferramentas, arrastar os seguintes controles para a página:

    • A Label controle para o título.

    • A Button controle para calcular o volume.

    • A Label controle e um TextBox controle de uma legenda e uma entrada.

    • A Label controle e um TextBox controle de uma legenda e uma saída.

  4. conjunto o Text propriedade dos controles com os seguintes valores:

    • Button1: Calcular

    • Label2: Entrada RADIUS

    • Label3: Saída de volume

  5. clicar no fonte guia para comutador para modo fonte.

  6. Adicionar a referência de script realçada seguinte à asp:ScriptManager elemento:

    <asp:ScriptManager ID="ScriptManager1" >
  <Scripts>    <asp:ScriptReference Path="JScript.js" />  </Scripts>
</asp:ScriptManager>

  7. No Gerenciador de Soluções, clique com o botão direito do mouse no nome do site e, em seguida, clique em Adicionar Novo Item.

    A caixa de diálogo Add New Item é exibida.

  8. Em O Visual Studio installed templates, selecionar Arquivo JScript e, em seguida, clicar Adicionar.

    Visual Studio cria e abre um novo arquivo chamado JScript.js.

    Observação:

    O nome do arquivo .js deve corresponder ao nome que aparece na referência de script na asp:ScriptManager elemento.

  9. Adicione o seguinte código ao arquivo JScript.js:

    function calcVolume(areaValue)
{
  /// <summary>Determines the volume of a cicle based on an area parameter.</summary>
  /// <param name="area" type="Number">The area of the circle.</param>
  /// <returns type="Number">Returns a number that represents the area.</returns>
  var volumeVal;
  volumeVal = Math.pow(areaValue,3);
  return volumeVal;
}

  10. salvar e fechar o arquivo JScript.js.

Exibindo JScript IntelliSense

JScript IntelliSense é usado para exibir detalhes sobre vários tipos de objetos de cliente, sistema autônomo elementos DOM (documento objeto Model) HTML dinâmico (DHTML), objetos intrínsecos e objetos definidos pelo usuário.Você também pode usar o IntelliSense para exibir informações sobre script comentada de XML e sobre Microsoft AJAX Library objetos.

Para exibir o JScript IntelliSense

  1. Alterne para ou abra a página padrão.aspx e alterne para modo fonte.

  2. Adicione o seguinte script elemento no participante do form elemento:

    <script type="text/javascript">

</script>

  3. Dentro de script elemento, digite o seguinte script:

    var displayTitle = document.

    Quando você digita o ponto (.), o editor exibe opções do IntelliSense que são apropriadas para o document objeto.

  4. rolar to the getElementById método e clicar no método ou pressione ENTER para adicionar a getElementById método do script.

  5. Complete a linha do script digitando o nome de um elemento para localizar, para que a linha seja exibida sistema autônomo segue:

    var displayTitle = document.getElementById("Label1");

  6. Adicione a seguinte linha do script para exibir o título em Label1:

    displayTitle.innerHTML = "Calculate Volume";

  7. Adicione a seguinte função incompleta no participante do script elemento:

    function calcArea(radiusParam)
{

}

  8. No calcArea função, digite o seguinte script:

      var areaVal = Math.

    Quando você digita o ponto (.), o editor exibe opções do IntelliSense que são apropriadas para o Math objeto intrínseco.

  9. Role para o PI propriedade e pressione ENTER para adicionar a PI propriedade para o script.

  10. Concluir o script para que a função apareça sistema autônomo segue:

    function calcArea(radiusParam)
{
  var areaVal = Math.PI * radiusParam * radiusParam;
  return areaVal;
}

  11. Adicione a seguinte função incompleta no participante do script elemento:

    function displayVolume()
{

}

  12. No displayVolume função, digite o seguinte script:

      radiusVal = $get("TextBox1").value;
  var areaVal = calcArea(

    Quando você digita o parêntese de abertura, o editor exibe informações sobre o valor do parâmetro para o do IntelliSensecalcArea função que você criou anteriormente.

  13. Concluir a linha do script para que o script é exibido sistema autônomo segue:

      var areaVal = calcArea(radiusVal);

  14. Continuar a adicionar o displayVolume função digitando o seguinte script:

      var volumeVal = calcVolume(

    Quando você digita o parêntese de abertura, o editor usa o IntelliSense para exibir os comentários de código XML que sejam baseiam o calcVolume função que você criou anteriormente.

  15. Conclua o displayVolume função para que a função aparecer da seguinte maneira:

    function displayVolume()
{
  radiusVal = $get("TextBox1").value;
  var areaVal = calcArea(radiusVal);
  var volumeVal = calcVolume(areaVal);
  $get("TextBox2").value = areaVal;
}
    Observação:

    O $ get método é uma função do ASP.NET AJAX que fornece um atalho para o getElementById método do Sys.UI.DomElement classe.

  16. Digite a seguinte linha do script no participante do script elemento:

    $addHandler(

    Quando você digita o parêntese de abertura, o editor exibe o IntelliSense para o ASP.NET AJAX $ addHandler método.

  17. Concluir a linha do script para que o script é exibido sistema autônomo segue:

    $addHandler($get("Button1"), "click", displayVolume);

    Verifique se esta linha está dentro de </script> Inserir marcas de formatação, mas não dentro de displayVolume função.

    Observação:

    O $ addHandler método é uma função do ASP.NET AJAX que fornece um atalho para o addHandler método do Sys.UI.DomEvent classe.

  18. salvar a página e, em seguida, pressione CTRL+F5 para executá-lo.

  19. Digite um valor para o RADIUS e, em seguida, clicar no botão.

    O resultado dos cálculos que você criou no JScript é exibido na segunda caixa de texto.

Próximas etapas

Esta explicação passo a passo ilustrou como trabalhar com o JScript IntelliSense.Convém aprender mais sobre como trabalhar com script de cliente em Visual Studio. Para obter detalhes, consulte:Adicionando AJAX e recursos de cliente.Para obter mais informações sobre JScript IntelliSense, consulte Visão geral do JScript IntelliSense.

Consulte também

Tarefas

Atribuindo Referências a Scripts Dinamicamente

Conceitos

Visão geral do JScript IntelliSense

Referência

Listar Membros

Outros recursos

Usando o IntelliSense

Sobre o modelo de objeto DHTML

Objetos de JScript

Atributo SRC | Propriedade src