javascript - 在 jQuery 插件的选项部分访问调用者元素的属性

Question

我有一些链接，根据它们在单击时显示的内容，它们具有不同的宽度和高度数据(此链接在服务器端生成)，例如:

<a class="inline" href="#inline-content-1" data-width="80%" data-height="80%">content 1</a>
<a class="inline" href="#inline-content-2" data-width="50%" data-height="80%">content 2</a>

现在我想使用类似的东西:

$('.inline').colorbox({inline:true, width:$(this).data('width'), height:$(this).data('height')});

但是 $(this).data('width') 在选项部分似乎无效

Answer 1

Colorbox can be passed a function to be evaluated in place of a static value for any of its properties.

$('.inline').colorbox({
     inline: true, 
     width: function(){ return $(this).data('width'); }, 
     height: function(){ return $(this).data('height'); }
});