Así que estoy ejecutando este javascript y todo funciona bien, excepto las rutas a la imagen de fondo. Funciona en mi entorno de desarrollo ASP.NET local, pero NO funciona cuando se implementa en un servidor en un directorio virtual.
Esto está en un archivo .js externo, la estructura de la carpeta es
Site/Content/style.css
Site/Scripts/myjsfile.js
Site/Images/filters_expand.jpg
Site/Images/filters_colapse.jpg
entonces aquí es donde se incluye el archivo 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')");
}
});
He intentado usar '/Images/filters_collapse.jpg'y eso tampoco funciona; sin embargo, parece funcionar en el servidor si lo uso '../../Images/filters_collapse.jpg'.
Básicamente, quiero tener la misma funcionalidad que ASP.NET tilda - ~.
actualizar
¿Las rutas de los archivos .js externos son relativas a la página en la que se incluyen o la ubicación real del archivo .js?
javascript
html
asp.net-mvc
css
path
Nate
fuente
fuente
Respuestas:
Rutas de archivos JavaScript
Cuando está en el script, las rutas son relativas a la página mostrada
para facilitar las cosas, puede imprimir una declaración js simple como esta y usar esta variable en todos sus scripts:
Solución, que se empleó en StackOverflow alrededor de febrero de 2010:
<script type="text/javascript"> var imagePath = 'http://sstatic.net/so/img/'; </script>Si estuviera visitando esta página alrededor de 2010, podría echar un vistazo a la fuente html de StackOverflow , podría encontrar este sencillo de una sola línea [formateado en 3 líneas :)] en la
<head />secciónfuente
imagePath.¡Gracias!Url.Content("~")obtener la raíz de la aplicación . hthvar imagePath = window.location.protocol + "//" + window.location.host + "/"obtenga la ubicación de su archivo javascript durante el tiempo de ejecución usando jQuery analizando el DOM para el atributo 'src' que lo refirió:
var jsFileLocation = $('script[src*=example]').attr('src'); // the js file path jsFileLocation = jsFileLocation.replace('example.js', ''); // the js folder path(asumiendo que su archivo javascript se llama 'ejemplo.js')
fuente
.replaceexpresión ajsFileLocation.replace(/example\.js.*$/, '')en caso de que haya una cadena de consulta como un número de versión después del.jsUna solución adecuada es usar una clase css en lugar de escribir src en el archivo js. Por ejemplo, en lugar de usar:
$(this).css("background", "url('../Images/filters_collapse.jpg')");utilizar:
$(this).addClass("xxx");y en un archivo css que se carga en la página escriba:
.xxx { background-image:url('../Images/filters_collapse.jpg'); }fuente
<img src="/codes/imgs/a.png">. No puedo configurar este atributo src por css.Buena pregunta.
Cuando esté en un archivo CSS, las URL serán relativas al archivo CSS.
Al escribir propiedades con JavaScript, las URL siempre deben ser relativas a la página (el recurso principal solicitado).
No hay ninguna
tildefuncionalidad incorporada en JS que yo sepa. La forma habitual sería definir una variable JavaScript especificando la ruta base:<script type="text/javascript"> directory_root = "http://www.example.com/resources"; </script>y hacer referencia a esa raíz siempre que asigne URL de forma dinámica.
fuente
Para la aplicación MVC4 en la que estoy trabajando, puse un elemento de script en _Layout.cshtml y creé una variable global para la ruta requerida, así:
<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>fuente
Usé el patrón de pekka. Creo que otro patrón más.
<script src="<% = Url.Content("~/Site/Scripts/myjsfile.js") %>?root=<% = Page.ResolveUrl("~/Site/images") %>">y analizó la cadena de consulta en myjsfile.js.
Complementos | Complementos de jQuery
fuente
Utilice la siguiente sintaxis para disfrutar del lujo de asp.net tilda ("~") en javascript
<script src=<%=Page.ResolveUrl("~/MasterPages/assets/js/jquery.js")%>></script>fuente
Encontré que esto funcionaba para mí.
<script> document.write(unescape('%3Cscript src="' + window.location.protocol + "//" + window.location.host + "/" + 'js/general.js?ver=2"%3E%3C/script%3E'))</script>entre etiquetas de script, por supuesto ... (no estoy seguro de por qué las etiquetas de script no aparecieron en esta publicación) ...
fuente
Debe agregar
runat="server"y y asignarle una ID, luego especifique la ruta absoluta de esta manera:<script type="text/javascript" runat="server" id="myID" src="~/js/jquery.jqGrid.js"></script>]Desde el código subyacente, puede cambiar el src mediante programación usando el ID.
fuente
Esto funciona bien en formularios web ASP.NET.
Cambie el script a
<img src="' + imagePath + 'chevron-large-right-grey.gif" alt="'.....Tengo una página maestra para cada nivel de directorio y esto está en el evento 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)Ahora, independientemente de si la aplicación se ejecuta localmente o se implementa, obtiene la ruta completa correcta
http://localhost:57387/Images/chevron-large-left-blue.pngfuente