2010-12-01 4 views
2

Я пытаюсь использовать JQuery с некоторыми страницами asp.net, которые используют мастер-страницы, и у меня возникают проблемы с загрузкой javascript-файла JQuery.JQuery с MasterPage в ASP.NET

Когда я включаю файл в разметке главной страницы, он прекрасно работает на страницах, которые находятся в том же каталоге, что и мастер-странице:

<script src="jquery/jquery-1.4.2.min.js" type="text/javascript"></script> 

но перерывы для страниц, которые не являются в том же каталоге, что и главная страница. Мастер-страницы наследуют путь к странице, которая их включает, поэтому относительный путь к файлу jquery .js отличается для разных страниц. И, конечно, я не могу иметь разные относительные пути в главном файле, потому что есть только один из них.

я мог бы использовать абсолютный путь:

<script src="/jquery/jquery-1.4.2.min.js" type="text/javascript"></script> 

но ломается, если сайт установлен в качестве виртуального каталога.

Моя следующая попытка была использовать «~», чтобы указать корень сайта:.

<script src="~/jquery/jquery-1.4.2.min.js" type="text/javascript"></script> 

Но тег сценария не понимает ~»

Так что я попытался сделать . что в коде-за от OnInit(), я попробовал:

string url = "~/jquery/jquery-1.4.2.min.js"; 
url = this.ResolveUrl(url); 
Page.ClientScript.RegisterClientScriptInclude("jquery_js", url); 

И это дает мне ошибки, когда JQuery Javascript работает у меня есть некоторые JavaScript в разметке страницы:.

$(document).ready(function() 
{ 
    ... 
} 

и я получаю «$» не определено. Я добавил предупреждение о начале jquery-1.4.2.min.js, и он загружается нормально, но после того, как этот бит javascript в файле .aspx выполнил.

Я попробовал ScriptManager.RegisterClientScriptInclude() вместо этого с тем же результатом.

+0

Каков HTML-код, который генерирует ваш последний пример? Включается ли он после тега скрипта, который включает в себя обработчик $ (document) .ready? – Goyuix 2010-12-02 00:07:25

+0

Нет. И в этом проблема. (Или конечная проблема. Если бы не главная страница, я мог бы поставить ссылки перед скриптом. Добавление ссылок из кода не позволило мне контролировать, где они были помещены. – 2010-12-02 21:19:25

ответ

0

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

Что находится в $(document).ready() может не выполняться до тех пор, пока страница не будет загружена, но $() будет выполнен немедленно, так как он читается браузером.

Решение переводит JavaScript, чтобы он появился позже в файле. Это не всегда так просто, как кажется, когда вы имеете дело с основными страницами и множеством пользовательских элементов управления.

Для меня самым легким способом справиться с этим было введение JavaScript из кода, используя RegisterStartupScript. Сценарии скриптов, введенные с этим, добавляются в конце формы. Исполняемые операторы в них будут выполняться только после того, как будут добавлены все файлы JavaScript.

1

Использование Page.ResolveUrl() так что по отношению к Page, а не Masterpage (и каталог управления это в), как это:

string url = Page.ResolveUrl("~/jquery/jquery-1.4.2.min.js"); 
5

Вы можете либо использовать:

<script type="text/javascript" src="<%= ResolveUrl("~/jquery/jquery-1.4.2.min.js")%>"></script> 

Или, возможно, выберете элемент управления, необходимый для переодевания:

<my:Script src="~/jquery/jquery-1.4.2.min.js" /> 

Или зарегистрируйте его с помощью ClientScriptManager, но лучше всего разместить его на странице.

0

Попробуйте сделать как ниже

StringBuilder sb = new StringBuilder(); 
      sb.Append("<script type=\"text/javascript\" src=\""); 
      sb.Append("http://yourwebsitename" + "/" + "directory"); 
      sb.Append("/"); 
      sb.Append("jquery.js"); 
      sb.Append("\"></script>"); 
     Header.Controls.Add(new LiteralControl(sb.toString())); 
5

Используйте Google, чтобы служить вашей JQuery:

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

Обратите внимание на отсутствие HTTP в атрибуте SRC, это будет решать любые проблемы, которые могут arrise с HTTP против HTTPS.

Вот почему: http://encosia.com/2008/12/10/3-reasons-why-you-should-let-google-host-jquery-for-you/

Ода кодекса имеет фантастическую статью на мастер-страниц, вы должны взглянуть на, а также:

http://odetocode.com/Articles/450.aspx

1

ResolveUrl это путь.

<script src="<%= ResolveUrl("~/scripts/jquery-1.4.4.min.js") %>" type="text/javascript"></script> 
0

с помощью Google является хорошим выбором конечно, но вы также можете добавлять свои ссылки в каждой из ваших страниц у вас есть проблемы с (thoes, который не может найти путь к JQuery) Например, если у вас есть страница называемый «MyPage.aspx» в другом каталоге, просто добавьте скрипт на html страницы «MyPage.aspx» относительно таким образом, страница thoes не может найти ваш адрес jquery, который будет отлично работать с новым, но с любовью Я надеюсь, что это работает вы

+2

Весь точка за помещением ссылки на jquery.js на главной странице, так что мне не нужно размещать ее отдельно на каждой странице. DRY - это фундаментальный принцип проектирования, который нарушается в вашей опасности. – 2010-12-02 04:56:01

0

не повторять Ваш сам

сделать функцию расширения для ваших страниц

public static class yourclass 
{ 
    public static string ConvertRelativePathToRootPath(this Page p, string pathfromroot) 
    { 


     string newUrl = ""; 
     Uri originalUri = HttpContext.Current.Request.Url; 
     newUrl = (originalUri.Scheme) + "://" + originalUri.Authority + pathfromroot; 
     return newUrl; 


    } 
} 

затем просто добавить следующий код на события загрузки страницы

string ss = Page.ConvertRelativePathToRootPath("~/script/jquery-1.4.1.min.js"); 
ScriptManager.RegisterClientScriptInclude(this, this.GetType(), "Jquery", ss); 

вы можете также использовать выше функции расширения для всех остальных требуется абсолютный путь, например, изображение или якорные метки в вашем файле с другим пути, отличным от вашего основного URL-адреса приложения :)

1

Вы можете попробовать src="<%= Page.ResolveClientUrl("~/jquery.js") %> в главной странице страницы.

$<script type="text/javascript" src="<% = Page.ResolveClientUrl("~/scripts/jquery-1.4.1.min.js") %>"></script> 
Смежные вопросы