Question

我有一个带编号针脚的谷歌地图。地图上的针脚为红色。页面中的实际地址应该有灰色标记。我正在尝试将background属性用于地址元素“LocationName”，其中包含附加灰色标记图像背景的地址（不重复左中心）。图像命名为greymarker1，greymarker2等。所以如果它是第一个地址，greymarker1.png应该是地址ONE前面的图标。我可以使用jquery设置后台css属性，但我不知道如何使URL动态.. '/ Style Library / Images / design / icons / greymarker1.png'）网址中的1应该随计数器改变..当计数器等于1时，它应该抓住greymarker1.png等。

 $('.LocationName').each(function(index){
    var counter=index+1;
    //$(this).css('color', 'blue');
    $(this).css("background-image", "url('/Style Library/Images/design/icons/greymarker1.png')");  

 });

Answer 1

$('.LocationName').each(function(index){
    $(this).css("background-image", 
       "url('/Style Library/Images/design/icons/greymarker" + index + ".png')");
});

Answer 2

我不确定你在这里要做什么，但看起来很简单，你可以附上计数器或类索引号到图像名称，如下所示：

 var path = '/Style/Library/Images/design/icons/greymarker';
 $('.LocationName').each(function(index){
    var counter=index+1;
    //$(this).css('color', 'blue');
    $(this).css("background-image", "url(" + path + counter + '.png')");  

 });

您可以通过创建属性和值列表（例如

）为您的css添加任意数量的值

 var path = '/Style/Library/Images/design/icons/greymarker';
     $('.LocationName').each(function(index){
        var counter=index+1;
                $(this).css({'background-image': 'url(' + path + counter + '.png)', 
                             'background-attribute': 'somevalue'
       });

     });

如何使用jquery使background css url动态化

2 个答案: