Question

问题背景：

我试图将{JIX函数的两个属性设置为img src，其中的图像存储在我的MVC网站的Images文件夹中。

问题：

以下代码显示了我的网站的nextText文件夹中设置为左右.jpg的属性prevText和Images：

    $(document).ready(function () {
    $('.bxslider').bxSlider({
        nextSelector: '#slider-next',
        prevSelector: '#slider-prev',
        controls: true,
        pager: false,
        nextText: '<img src="~/Images/rightArrow.jpg" height="25" width="25"/>',
        prevText: '<img src="~/Images/leftArrow.jpg" height="25" width="25"/>'
    });

目前上面的内容会在我的网页上生成已损坏的图片。我可以使用~获取img src代码的相对路径吗？如果我在img src中提供来自Google的外部图片网址，那么就可以了。

如何正确设置nextText和prevText属性，以便他们在我网站的Images文件夹中使用图片？

Answer 1

只需在布局页面的脚本标记中创建baseUrl即可。

<script type="text/javascript">
 var baseUrl = "@Url.Content("~")";
</script>

并在您的脚本中使用它，如下所示：

 $(document).ready(function () {
    $('.bxslider').bxSlider({
        nextSelector: '#slider-next',
        prevSelector: '#slider-prev',
        controls: true,
        pager: false,
        nextText: '<img src="'+baseUrl +'Images/rightArrow.jpg" height="25" width="25"/>',
        prevText: '<img src="'+baseUrl +'Images/leftArrow.jpg" height="25" width="25"/>'
    });

即使在部署之后，这仍然有效。我有同样的问题，我用这种方式来解决这个问题。

将JQuery propeties设置为img src标记

1 个答案: