我有我的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
有人可以帮助这些报价。
谢谢。
答案 0 :(得分: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);
答案 1 :(得分:0)
@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" );