Поделиться через

Пошаговое руководство. IntelliSense для JScript

  • Статья

Обновлен: Ноябрь 2007

В этом пошаговом руководстве описано как IntelliSense используется для поддержки разработки клиентских сценариев в Visual Studio. IntelliSense упрощает доступ к справочникам по языку. Во время программирования нет необходимости покидать редактор кода для поиска элементов языка, таких как синтаксис или списки параметров. Вместо этого можно остаться в режиме редактирования, найти необходимые сведения и вставить элементы языка непосредственно в код. Visual Studio поддерживает технологию IntelliSense для языка Microsoft JScript и других языков ECMAScript, таких как JavaScript.

Bb385674.alert_note(ru-ru,VS.90).gifПримечание.

В частности, этот документ относится к языку Jscript. При этом IntelliSense в Visual Studio и Visual Web Developer работает со всеми языками ECMAScript, включающими JavaScript.

Visual Studio поддерживает IntelliSense для обеспечения следующих функциональных возможностей.

  • Элементы DHTML Document Object Model (DOM).

  • Встроенные объекты.

  • Пользовательские переменные, функции и объекты.

  • Ссылки на внешние файлы.

  • Комментарии к коду XML

  • Объекты ASP.NET AJAX.

Дополнительные сведения о функциональных возможностях IntelliSense в Visual Studio см. в разделе Использование технологии IntelliSense. Дополнительные сведения о технологии IntelliSense для JScript см. в разделе Общие сведения о IntelliSense для JScript.

Обязательные компоненты

Для выполнения инструкций данного пошагового руководства необходимы следующие компоненты:

  • Visual Studio 2008 или Microsoft Visual Web Developer, экспресс-выпуск.

Создание веб-узла и страницы

Для начала потребуется создать веб-узел ASP.NET со вспомогательными объектами, ссылками и сценарием. Если веб-узел уже был создан (например, по шагам, описанным в разделе Пошаговое руководство. Создание нового веб-узла ASP.NET), то можно использовать его и перейти к следующему разделу данного пошагового руководства. В противном случае, создайте новый веб-узел и страницу, выполнив следующие действия.

Чтобы создать веб-приложение, выполните следующие действия:

  1. Откройте Visual Studio 2008 или Microsoft Visual Web Developer, экспресс-выпуск.

  2. В меню Файл выберите пункт Создать веб-узел.

    Откроется диалоговое окно Создать веб-узел.

  3. В группе Установленные шаблоны Visual Studio выберите Веб-узел ASP.NET.

  4. Из списка Расположение выберите Файловая система.

  5. В поле рядом со списком Расположение введите имя папки, где следует хранить страницы веб-узла.

    Например, введите имя папки C:\IntellisenseWebSite1.

  6. В списке Язык выберите Visual Basic или Visual C# и нажмите кнопку ОК.

    Выбранный язык программирования будет языком по умолчанию для создания серверного кода для веб-узла. Выбор языка в этом пошаговом руководстве не имеет значения, поскольку будет использоваться только клиентский сценарий, выполняющийся в обозревателе.

    Visual Web Developer создает папку и новую страницу с именем Default.aspx. По умолчанию, при создании новой страницы Visual Web Developer отобразит страницу в представлении источника где можно увидеть HTML-элементы страницы.

Добавление на страницу элементов управления и кода JScript

На страницу Default.aspx теперь необходимо добавить элементы управления и код JScript.

Чтобы добавить элементы управления и код JScript на страницу, выполните следующие действия.

  1. Щелкните вкладку Конструктор, чтобы перейти в представление конструктора.

  2. Из вкладки Расширения AJAX в Панели элементов перетащите на страницу элемент управления UpdatePanel.

  3. Из вкладки Стандартные в Панели элементов перетащите на страницу следующие элементы управления.

    • Элемент управления Label для заголовка.

    • Элемент управления Button для расчета объема.

    • Элементы управления Label и TextBox для заголовка и ввода.

    • Элементы управления Label и TextBox для заголовка и вывода.

  4. Свойству Text элементов управления присвойте следующие значения:

    • Button1: Вычислить

    • Label2: Ввод радиуса

    • Label3: Вывод объема

  5. Чтобы перейти к представлению источника щелкните вкладку Источник.

  6. В элемент asp:ScriptManager добавьте следующую выделенную ссылку сценария:

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

  7. В Обозревателе решений щелкните правой кнопкой мыши на имени веб-узла и нажмите кнопку Добавить новый элемент.

    Откроется диалоговое окно Добавление нового элемента.

  8. В разделе Установленные шаблоны Visual Studio выберите Файл JScript, а затем Добавить.

    Visual Studio создает и открывает новый файл с именем JScript.js.

    Bb385674.alert_note(ru-ru,VS.90).gifПримечание.

    Имя файла с расширением .js должно совпадать с именем в ссылке сценария в элементе asp:ScriptManager.

  9. В файл 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. Сохраните и закройте файл JScript.js.

Обзор JScript IntelliSense

Технология JScript IntelliSense используется для отображения сведений о многих типах клиентских объектов, таких как элементах Dynamic HTML (DHTML) Document Object Model (DOM), встроенных объектах и пользовательских объектах. IntelliSense можно использовать для отображения сведения о сценариях с XML-комментариями и об объектах Microsoft AJAX (библиотека).

Отображение JScript IntelliSense

  1. Перейдите к странице Default.aspx или откройте ее и переключитесь в режим конструктора.

  2. В конец элемента form добавьте следующий элемент script:

    <script type="text/javascript">

</script>

  3. Внутри элемента script наберите следующий сценарий:

    var displayTitle = document.

    После набора знака точки (.), в редакторе отображаются варианты IntelliSense, соответствующие объекту document.

  4. Перейдите к методу getElementById и щелкните его или нажмите клавишу ENTER, чтобы добавить метод getElementById в сценарий.

  5. Завершите строку сценария, набрав имя элемента, который необходимо найти, так чтобы строка имела следующий вид:

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

  6. Для отображения заголовка в Label1 добавьте следующую строку сценария:

    displayTitle.innerHTML = "Calculate Volume";

  7. В конец элемента script добавьте следующую неполную функцию:

    function calcArea(radiusParam)
{

}

  8. В функции calcArea наберите следующий сценарий:

      var areaVal = Math.

    После набора знака точки (.), в редакторе отображаются варианты IntelliSense, соответствующие встроенному объекту Math.

  9. Перейдите к свойству PI и нажмите клавишу ENTER, чтобы добавить свойство PI в сценарий.

  10. Завершите сценарий, чтобы функция имела следующий вид:

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

  11. В конец элемента script добавьте следующую неполную функцию:

    function displayVolume()
{

}

  12. В функции displayVolume наберите следующий сценарий:

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

    После набора открывающей скобки в редакторе выводятся сведения IntelliSense о значении параметра для функции calcArea, которая была создана раньше.

  13. Завершите строку сценария, чтобы сценарий имел следующий вид:

      var areaVal = calcArea(radiusVal);

  14. Продолжите дополнение функции displayVolume, набрав следующий сценарий:

      var volumeVal = calcVolume(

    После набора открывающей скобки IntelliSense используется в редакторе для отображения комментариев к коду XML, основанным на функции calcVolume, которая была создана раньше.

  15. Завершите функцию displayVolume, так чтобы она имела следующий вид:

    function displayVolume()
{
  radiusVal = $get("TextBox1").value;
  var areaVal = calcArea(radiusVal);
  var volumeVal = calcVolume(areaVal);
  $get("TextBox2").value = areaVal;
}
    Bb385674.alert_note(ru-ru,VS.90).gifПримечание.

    Метод $get представляет собой функцию ASP.NET AJAX, обеспечивающую краткое имя для метода getElementById класса Sys.UI.DomElement.

  16. В конце элемента script наберите следующую строку сценария:

    $addHandler(

    После набора открывающей скобки в редакторе отображается IntelliSense для метода ASP.NET AJAX $addHandler.

  17. Завершите строку сценария, чтобы сценарий имел следующий вид:

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

    Строка должна быть расположена внутри тега </script>, а не внутри функции displayVolume.

    Bb385674.alert_note(ru-ru,VS.90).gifПримечание.

    Метод $addHandler представляет собой функцию ASP.NET AJAX, обеспечивающую краткое имя для метода addHandler класса Sys.UI.DomEvent.

  18. Сохраните страницу и нажмите клавиши CTRL + F5 для запуска.

  19. Введите значение для радиуса и нажмите кнопку.

    Результат вычислений, созданных в JScript, возраста отображается во втором текстовом поле.

Следующие действия

В данном пошаговом руководстве показано, как работать с JScript IntelliSense. Можно также получить дополнительные сведения по работе с клиентским сценарием Visual Studio. Дополнительные сведения см. в разделе Добавление клиентских возможностей и возможностей AJAX. Дополнительные сведения о JScript IntelliSense см. в разделе Общие сведения о IntelliSense для JScript.

См. также

Задачи

Динамическое присваивание ссылок на сценарии

Основные понятия

Общие сведения о IntelliSense для JScript

Ссылки

Список членов

Другие ресурсы

Использование технологии IntelliSense

Сведения об объектной модели DHTML

Объекты JScript

Атрибут SRC | Свойство src