Question

我有我的js文件，我正在动态更改图像src。

这是我正在尝试的当前代码：

    $("#prodFront").attr("src", '@Url.Content("~/Order_Images/Campaigns/"' 
    + campaignKey + '"/"' + id + '"/General/front.png"")');

我的图片实际上位于以下位置：

Root folder/Order_Images/Campaigns/
765662bd-06ec-4925-8611-f147e232a124/1/General/front.png

$("#prodFront").attr("src",
'@Url.Content("~/Order_Images/Campaigns/
765662bd-06ec-4925-8611-f147e232a124/1/General/front.png")');

但我的代码总是到达

这样的位置

http://localhost:50209/BuyNow/Index/@Url.Content(%22~/Order_Images/
Campaigns/765662bd-06ec-4925-8611-f147e232a124/1/General/front.png%22)

我可以在这里查看图片：

http://localhost:50209/Order_Images/Campaigns/765662bd-06ec-4925-8611-  
f147e232a124/1/General/front.png

有人可以帮助这些报价。

谢谢。

Answer 1

由于campaignKey和id是JavaScript变量。您不能将它们与@Url.Content一起使用，因为它将由服务器端的Razor引擎执行。

作为一种变通方法，您可以使用占位符-1生成网址，-2用于生成网址，使用简单的字符串操作替换该网址。

//Generate URL
var url ='@Url.Content("~/Order_Images/Campaigns/-1/-2/General/front.png")';

//Replace placeholder
url = url.replace('-1', campaignKey).replace('-2', id);

//Set image
$("#prodFront").prop("src",url);

Answer 2

@Url.Content是一个剃刀命令，在调用页面时使用C＃创建一个字符串。您无法将@Url.Content作为“动态”值传递，您需要在控制器中调用Url.Content并将结果字符串传递给您的javascript。这就是为什么它会以http://localhost:50209/BuyNow/Index/@Url.Content(%22~/Order_Images/的形式出现。对服务器进行Ajax调用将是我如何处理它。

$.ajax({
        url: Url.Content("GetImageUrlAction", "SomeController" ),
        data: {id = theImageYouWantsId},
        success: function( returnData ){
                $('#prodFront').attr('src', returnData.imageUrl );
            }
    });

然后有这样的控制器

public JsonResult GetImageUrlAction( string, campaginKey, string id ){
    var imageUrl = Url.Content( "~//Order_Images//Campagins//" + campaginKey + "//" + id + 
                                "//General/front.png" );
    return Json( new { imageUrl } );
}

如果您的基本目录不会改变，您可以在页面加载时设置基本变量，然后稍后再添加campaginKey和id

//Declare your variable on document ready
$(document).ready( function(){
    baseUrl = '@Url.Content( "~/Order_Images/Campaigns/" )';
});

然后在你的jquery中你可以添加它

$("#prodFront").attr("src", baseUrl + campaginKey + "/" + id + 
"/1/General/front.png" );

MVC jquery图像src Url.Content引用问题

2 个答案: