Относительные пути в Javascript во внешнем файле

Question 1

Итак, я запускаю этот javascript, и все работает нормально, кроме путей к фоновому изображению. Он работает в моей локальной среде ASP.NET Dev, но НЕ работает при развертывании на сервере в виртуальном каталоге.

Это внешний файл .js, структура папок

Site/Content/style.css
Site/Scripts/myjsfile.js
Site/Images/filters_expand.jpg
Site/Images/filters_colapse.jpg

тогда сюда включается файл js из

Site/Views/ProductList/Index.aspx

$("#toggle").click(function() {
    if (left.width() > 0) {
        AnimateNav(left, right, 0);
        $(this).css("background", "url('../Images/filters_expand.jpg')");
    }
    else {
        AnimateNav(left, right, 170);
        $(this).css("background", "url('../Images/filters_collapse.jpg')");
    }
});

Я пробовал использовать, '/Images/filters_collapse.jpg'но это тоже не работает; однако, похоже, он работает на сервере, если я использую '../../Images/filters_collapse.jpg'.

По сути, я хочу иметь такую же функциональность, что и тильда ASP.NET - ~.

Обновить

Относятся ли пути во внешних файлах .js к странице, в которую они включены, или к фактическому расположению файла .js?

Question 2

Пути к файлам JavaScript

В скрипте пути указываются относительно отображаемой страницы.

чтобы упростить задачу, вы можете распечатать простое объявление js, подобное этому, и использовать эту переменную во всех своих скриптах:

Решение, которое использовалось в StackOverflow примерно в феврале 2010 года:

<script type="text/javascript">
   var imagePath = 'http://sstatic.net/so/img/';
</script>

Если вы посещали эту страницу примерно в 2010 году, вы могли бы просто взглянуть на исходный HTML-код StackOverflow , вы могли бы найти этот крутой однострочный [отформатированный до 3 строк :)] в <head />разделе

Question 3

получить местоположение вашего файла javascript во время выполнения с помощью jQuery, проанализировав DOM для атрибута src, который его ссылается:

var jsFileLocation = $('script[src*=example]').attr('src');  // the js file path
jsFileLocation = jsFileLocation.replace('example.js', '');   // the js folder path

(при условии, что ваш файл javascript называется example.js)

Question 4

Правильное решение - использовать класс css вместо записи src в файле js. Например, вместо использования:

$(this).css("background", "url('../Images/filters_collapse.jpg')");

использование:

$(this).addClass("xxx");

и в файле css, который загружается на странице, напишите:

.xxx {
  background-image:url('../Images/filters_collapse.jpg');
}

Question 5

Хороший вопрос.

В файле CSS URL-адреса будут относиться к файлу CSS.
При написании свойств с использованием JavaScript URL-адреса всегда должны указываться относительно страницы (основного запрошенного ресурса).

tildeНасколько мне известно, в JS нет встроенных функций. Обычным способом было бы определить переменную JavaScript, указывающую базовый путь:

<script type="text/javascript">

  directory_root = "http://www.example.com/resources";

</script>

и ссылаться на этот корень всякий раз, когда вы динамически назначаете URL-адреса.

Question 6

Для приложения MVC4, над которым я работаю, я поместил элемент скрипта в _Layout.cshtml и создал глобальную переменную для требуемого пути, например:

<body>

<script>
    var templatesPath = "@Url.Content("~/Templates/")";
</script>

<div class="page">
    <div id="header">

       <span id="title">

        </span>
    </div>
    <div id="main">


        @RenderBody()
    </div>
    <div id="footer">
        <span></span>
    </div>
</div>

Question 7

Я использовала выкройку Пекки. Думаю, еще одна закономерность.

<script src="<% = Url.Content("~/Site/Scripts/myjsfile.js") %>?root=<% = Page.ResolveUrl("~/Site/images") %>">

и проанализировал строку запроса в myjsfile.js.

Плагины | Плагины jQuery

Question 8

Используйте следующий синтаксис, чтобы насладиться роскошью asp.net tilda ("~") в javascript

<script src=<%=Page.ResolveUrl("~/MasterPages/assets/js/jquery.js")%>></script>

Question 9

Я обнаружил, что это работает для меня.

    <script> document.write(unescape('%3Cscript src="' + window.location.protocol + "//" +     
    window.location.host + "/" + 'js/general.js?ver=2"%3E%3C/script%3E'))</script>

между тегами сценария, конечно ... (я не уверен, почему теги сценария не появились в этом посте) ...

Question 10

Вам нужно добавить runat="server"и и присвоить ему идентификатор, а затем указать абсолютный путь следующим образом:

<script type="text/javascript" runat="server" id="myID" src="~/js/jquery.jqGrid.js"></script>]

Из внутреннего кода вы можете программно изменить src, используя идентификатор.

Question 11

Это хорошо работает в веб-формах ASP.NET.

Измените сценарий на

<img src="' + imagePath + 'chevron-large-right-grey.gif" alt="'.....

У меня есть главная страница для каждого уровня каталога, и это находится в событии Page_Init

  Dim vPath As String = ResolveUrl("~/Images/")
    Dim SB As New StringBuilder
    SB.Append("var imagePath = '" & vPath & "'; ")
    ScriptManager.RegisterClientScriptBlock(Me, Me.GetType(), "LoadImagePath", SB.ToString, True)

Теперь независимо от того, запущено ли приложение локально или развернуто, вы получите правильный полный путь

http://localhost:57387/Images/chevron-large-left-blue.png