Как заставить JQuery и ASP.Net работать вместе?

Question

Есть ли причина, по которой JQuery не будет работать при использовании на странице ASPX? Мы пытались заставить работать простой вызов, подобный этому:

$(document).ready(function() {
    alert("This is SPARTA!!!!!!!!!");
});

Окно предупреждения никогда не отображается. У меня был некоторый опыт работы с JS и ASP.Net с кнопками, и я знаю, что должен возвращать false после JS вроде:

<input type=button value="Button 1" 
   onclick='button_1_onclick();return false;'>

Есть ли что-то подобное, что нужно сделать?

Отредактировано: я запустил Firebug в режиме отладчика, и JS никогда не запускался, все библиотеки присутствуют на странице. Единственное, о чем я могу думать, это то, что готовое событие не вызвано или что-то подобное.

Answer 1

ASP.NET и JQuery играют очень хорошо вместе (а также с библиотекой ASP.NET AJAX), я использовал их все вместе в недавнем веб-приложении ASP.NET 3.5. Есть некоторые странности, о которых нужно знать , но в целом они хорошо работают вместе.

Во-первых, вам нужно убедиться, что у вас есть тег script с src вашего файла jQuery-

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>

Обычно я делал это, добавляя ScriptReference в ScriptManager, но в любом случае это работает. Затем поместите свой код jQuery после тега script -

$(function() { alert("This is SPARTA!!!!!!!!!"); });

Если ваш файл jQuery находится в папке, и на вашем сайте настроена какая-то аутентификация, то вам нужно убедиться, что папка доступна на страницах, где вы используете jQuery, изменив web.config ( так же, как вам нужно сделать с изображениями и CSS). Я был сбит с толку этим раньше. Вы можете проверить в firebug, чтобы увидеть, доступен ли код jQuery (то есть видимый), развернув соответствующий узел скрипта; если вы видите какую-то ошибку HTTP, это может быть связано с недоступностью скрипта.

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

(function($) {

$(function() { alert("This is SPARTA!!!!!!!!!"); });

})(jQuery);

Это означает, что $ в области видимости внешней функции является сокращением для объекта jQuery.

Answer 2

Вы одновременно используете другую библиотеку? Возможно, $ был переназначен, попробуйте это:

jQuery(document).ready(function() {
    alert("This is SPARTA!!!!!!!!!");
});

Answer 3

Может быть, вы сделали ту же ошибку, что и я:

Я включил ссылку на скрипт jQuery на мою главную страницу. В результате на странице .Aspx не удалось найти файл JQuery.js, поскольку я поместил его в другую папку.

На главной странице я теперь включаю jQuery, используя

<script src="<%= this.ResolveUrl("~/js/jquery.js") %>"></script>

Answer 4

Вы пытались поместить ссылку на JavaScript после включения CSS?

У меня были проблемы, когда $(document).ready не запускался, так как классы CSS не были загружены. Перемещение JQuery включает, кажется, разобраться.

Может не совпадать с вашей проблемой, но стоит попробовать.

Answer 5

Для этого может быть два человека:

1) Возможно, вам не хватает

<script language="JavaScript" src="JQuery.js"></script>

заявление.

2) В конце вашего оповещения отсутствует точка с запятой. Должно быть:

$(document).ready(function() {   alert("This is SPARTA!!!!!!!!!"); });

Answer 6

Я попробовал это. Вам нужно обратиться к библиотеке jquery, и у вас должна быть функция $ (document) .ready. Вы также должны ссылаться на свою кнопку с помощью класса, чтобы jquery мог найти, какую кнопку вы ищете. Затем вы сообщаете jquery, что вы собираетесь делать с этим объектом, например, с помощью .click ().

Вот код: Ссылка на библиотеку jquery.

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>

Оберните следующее в тег скрипта.

    $(document).ready(function()
    { 
        $('.clicker').click(function() 
        {

           alert('This is SPARTA!!!!');
        });
    });

Затем в HTML-коде страницы вы делаете свою кнопку такой:

<input type="button" value="Show Alert" class="clicker" />

Надеюсь, это поможет некоторым.