Question

我正在使用jQuery Lightbox作为我的图片库按钮图片的网址为“../../Content/Lightbox/lightbox-btn-next.gif” 如果我的网址为“localhost/Something1/Somtehing2”，那该工作正常如果我使用其他路线，例如“localhost/Something1/Something2/Something3”，则按钮图像的网址不正确。
我可以在.js文件中使用Url.Action()吗？
这就是我调用.js文件的方式：

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

Answer 1

我将以下内容放在我的母版页中，它完成了与@ Url.Content（'〜/ path'）完全相同的事情：

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

当编译并提供我的母版页时，这会转换为将我的站点根应用于路径的javascript函数。效果很好。 path.replace正则表达式只是删除一个前导斜杠，如果有一个斜杠，因为@ Url.Content（“〜/”）有一个终止斜杠。

Answer 2

您不能在.js文件中使用Url.Action（）。但是你可以定义全局变量并在你的js文件中使用它。

<script type="text/javascript">

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

</script>

Answer 3

只需将@Url.Content(@"~/some paths")放入单引号，例如：

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

Answer 4

我更喜欢从标签'href'或'action'中提取URL，或者其他一些有意义的元素。

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

在我的javascript中（仔细检查jQuery，我不确定它是否是确切的语法。）：

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

另一个稍微偏好的选项是在文件顶部添加设置：

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

我说'不太喜欢'因为这种方法混合了标记和代码。

另一种方法（需要大量整理）是从控制器为你提供js文件：

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");
}

JavaScript中的URL帮助器

4 个答案: