引导模式中的动态数据属性

Question

I made a piece of code that changes the data attribute of a link that opens a bootstrap modal window. I cannot get the modified data attribute (provided by setLink(); ) from the shown.bs.modal function.

How do I proceed? Example below always displays the value of the original data attribute(first data set from setLink() ... but not other value called after).

Note : Modal preview is always called after setLink function. I call setLink(); then I click on the preview link that open modal.

<a href="javascript:void(0)" class="preview" data-toggle="modal" data-target="#preview" data-link="">Preview</a>

<a href="javascript:void(0)" onclick="setLink()">Change link</a>

function setLink(){
    var quotes = new Array("Salon du vin Belgique", "Salon du vin et gastronomie", "Salon du vin de Huy", "Vins et produits bio", "Dégustation de vins de qualités", "Foire des vins", "Salon du vin et des produits bio", "Foire des vins de Huy", "Salon du vin et de la gastronomie de Huy", "Foire des vins et des produits bio", "Foire des vins et de la gastronomie",  "Découvrir des meilleurs vins de cette année", "Nous sommes présents au salon du vin de Huy"),
        randno = quotes[Math.floor( Math.random() * quotes.length )];

    $('.preview').attr('data-link', randno);
}

$('#preview').on('shown.bs.modal', function(event)
{
    var btn = $(event.relatedTarget),
        link = btn.data('link');

    $(this).find('.modal-body').html('<a href="javascript:void(0);">'+link+'</a>');
});

Answer 1

Ok, jquery dom process => I change btn.data('link'); to btn.attr('data-link'); and it work