2010-02-10 14 views
8

Estoy usando jQuery Lightbox para mi galería de imágenes.
La URL de la imagen del botón es '../../Content/Lightbox/lightbox-btn-next.gif'
Eso funciona bien si mi URL es 'localhost/Something1/Somtehing2'
Si utilizo otra ruta como 'localhost/Something1/Something2/Something3', entonces URL para imágenes de los botones es incorrecta.
¿Puedo usar Url.Action() dentro de archivos .js?
Esta es la forma en que llamo archivos .js:Asistente de URL en JavaScript

<script type="text/javascript" src="<%= Url.Content("~/Scripts/jquery.lightbox-0.5.js") %>"></script> 

Respuesta

5

No puede utilizar Url.Action() dentro .js. Pero puede definir una variable global y usarla en su archivo js.

<script type="text/javascript"> 

    var imageUrl = "<%= ... %>"; 

</script> 
+0

Tnx! Eso resolvió mi problema. –

0

prefiero tirar de las direcciones URL de los 'href o forma' A etiquetas de acción - o algún otro elemento que tenga sentido.

<img class="_click" src="<%= Url.Content("~/my/image.png") %>" alt="Click" /> 

Y en mi Javascript (comprobar esto en jQuery, no estoy seguro de si es la sintaxis exacta.):

var url = $('._click').attr('href'); 
// To pass these to your plugin as options 
// see lightbox source for a full list 
$('a').lightBox({ imageLoading : url }) 

Otra opción un poco menos preferido es añadir la configuración en la parte superior de su archivo:

<script type="text/javascript"><![CDATA[ 
    $('a').lightBox({ imageLoading : <%= Url.Content("~/my/image.png") %> }) 
//]]></script> 

Dije 'menos preferido' porque este enfoque mezcla el marcado y el código.

Otro enfoque (que necesita una gran cantidad de poner en orden) es de servirle js archivo desde un controlador:

public ActionResult GetFileContent(string filename) 
{ 
    // important: make sure to control the path for security 
    var path = Server.MapPath("~/Scripts/" + filename); 
    var content = System.IO.File.ReadAllText(path); 

    // Use some kind of template convention 
    content = content.Replace("{{IMAGE_PATH}}", Url.Content(@"~/my/image.png")); 

    var bytes = new UTF8Encoding().GetBytes(content); 
    return new FileContentResult(bytes, "text/javascript"); 
} 
+0

La url está dentro jquery.lightbox-0.5.js no tengo una una etiqueta dentro de la vista. –

+0

¿Quizás puedas usar la etiqueta de script? ¿Dónde está ejecutando su llamada lightbox()? – ziya

+0

Estoy ejecutando una llamada a lightbox dentro de la vista parcial. Hay una explicación en http://leandrovieira.com/projects/jquery/lightbox cómo se puede anular esta configuración. Pero eso no funciona :) –

10

pongo el siguiente en mi página principal, que lleva a cabo la misma cosa como @ Url.Content ('~/path'):

<script type="text/javascript" charset="utf-8"> 
    function UrlContent(path) { 
     return '@Url.Content("~/")' + path.replace(/^\//, ''); 
    } 
</script> 

Cuando mi página maestra se compila y se sirve esto se traduce en una función de JavaScript que aplica mi raíz del sitio a la ruta. Funciona genial. El path.replace regex simplemente elimina una barra diagonal inicial si la hay, ya que @ Url.Content ("~ /") tiene una barra diagonal.

+0

Gracias @matt. Excelente idea y funciona bastante bien aquí. –

2

Sólo hay que poner en @Url.Content(@"~/some paths") comillas simples como esta:

'@Url.Content(@"~/some paths")'