是否可以为单个标记设置自定义样式? 我尝试将边框颜色设置为我添加的每个标记的自定义颜色,而不是使用一个单独的类。那些颜色是我事先无法知道的颜色,我需要在程序运行时设置它们。这就是为什么我不能创建十几个类并将其用于此目的的原因。
答案 0 :(得分:1)
您可以使用类似于cloud9在此处使用的动态标记https://github.com/c9/core/blob/2d05ddeb7c0c1f6f3b35e305f60d1ba4f39f0294/plugins/c9.ide.collab/author_layer.js#L41 https://github.com/c9/core/blob/2d05ddeb7c0c1f6f3b35e305f60d1ba4f39f0294/plugins/c9.ide.collab/author_layer.js#L98
答案 1 :(得分:-2)
您可以采用以下方法:https://jsfiddle.net/sheriffderek/wkwzprfh/
<ul class="marker-type-list">
<li class='marker-type'>
<button class='js-create-marker' data-color='red'>Create red marker</button>
</li>
<li class='marker-type'>
<button class='js-create-marker' data-color='green'>Create green marker</button>
</li>
<li class='marker-type'>
<button class='js-create-marker' data-color='blue'>Create blue marker</button>
</li>
</ul>
<ul class='marker-list'><!-- X --></ul>
$('.js-create-marker').on('click', function() {
var color = $(this).data('color');
console.log(color);
$('.marker-list').append('<li class="marker ' + color + '">marker</li>');
});
.marker.red {
color: red;
}
.marker.green {
color: green;
}
.marker.blue {
color: blue;
}