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

Question

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

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

это во внешнем .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 файл?

1834 10

javascript html css asp.net-mvc path

10 ответов:

Comments

Ничего не найдено.

Juraj Blahunka · Accepted Answer · 2013-10-18 10:44:49

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

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

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

решение, которое было использовано на StackOverflow около февраля 2010 года:
<script type="text/javascript">
   var imagePath = 'http://sstatic.net/so/img/';
</script>
если вы посещали эту страницу около 2010 года, вы могли бы просто взглянуть на html-источник StackOverflow, вы можете найти этот задира однострочный [отформатированный до 3 строк :)] в <head /> раздел

schory · Accepted Answer · 2010-12-14 17:18:01

получите местоположение вашего файла 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 называется ' пример.js')

PHPst · Accepted Answer · 2012-03-17 10:33:23

правильное решение-использовать класс css вместо записи src в JS-файл. Например, вместо использования:
$(this).css("background", "url('../Images/filters_collapse.jpg')");
использование:
$(this).addClass("xxx");
и в файле css, который загружен на странице, напишите:
.xxx {
  background-image:url('../Images/filters_collapse.jpg');
}

Pekka 웃 · Accepted Answer · 2010-02-03 01:09:23

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

когда в файле CSS, URL-адреса будут относительно файла CSS.

при написании свойств с помощью JavaScript URL-адреса всегда должны быть относительно страницы (основного запрашиваемого ресурса).

нет tilde функциональность встроенный в JS, что я знаю. Обычным способом было бы определить переменную JavaScript, указывающую базовый путь:
<script type="text/javascript">

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

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

takepara · Accepted Answer · 2010-02-03 18:16:04

я использовал шаблон Пекки. Думаю, еще одна закономерность.
<script src="<% = Url.Content("~/Site/Scripts/myjsfile.js") %>?root=<% = Page.ResolveUrl("~/Site/images") %>">
и проанализировал строку запроса в myjsfile.js.

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

Vijayanand Settin · Accepted Answer · 2014-11-27 04:02:54

для приложения 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>

Mandeep Janjua · Accepted Answer · 2012-06-26 06:18:08

пожалуйста, используйте следующий синтаксис, чтобы насладиться роскошью asp.net Тильда ( " ~ " ) в javascript
<script src=<%=Page.ResolveUrl("~/MasterPages/assets/js/jquery.js")%>></script>

JamminJamaican · Accepted Answer · 2014-05-02 17:59:12

Я нашел, что это работает для меня.
    <script> document.write(unescape('%3Cscript src="' + window.location.protocol + "//" +     
    window.location.host + "/" + 'js/general.js?ver=2"%3E%3C/script%3E'))</script>
между тегами скрипт конечно... (Я не уверен, почему теги сценария не появились в этом сообщении)...

Samir Ahmed · Accepted Answer · 2013-04-20 15:23:35

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

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

от codebehind, вы можете изменить src программно с помощью идентификатора.

gchq · Accepted Answer · 2014-11-02 04:42:26

Это хорошо работает в 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