將數據屬性值插入Iframe src

Question

我有一個數字按鈕，當按下它們時會打開一個帶iframe的模態。 這些按鈕具有存儲要傳遞給iframe scr的鏈接的數據屬性。

這是按鈕的代碼：

<a href="#myModal" style="float: right;" class="btn btn-outline-secondary" data-toggle="modal" data-jobid="index.php?/job/view/1" ><strong>View</strong></a>

<a href="#myModal" style="float: right;" class="btn btn-outline-secondary" data-toggle="modal" data-jobid="index.php?/job/view/2" ><strong>View</strong></a>

<a href="#myModal" style="float: right;" class="btn btn-outline-secondary" data-toggle="modal" data-jobid="index.php?/job/view/3" ><strong>View</strong></a>

這是iframe的代碼：

<iframe style="display: block; width: 100%; height: 100%; border: none;" src=""></iframe>

我的問題是，每次單擊其中一個按鈕時，如何將data-jobid傳遞給iframe的src ？

Answer 1

您可以將click處理程序掛接到.btn-outline-secondary元素，然后在設置iframe的src屬性之前從它們讀取data()屬性，如下所示：

$('.btn-outline-secondary').click(function() {
  $('iframe').attr('src', $(this).data('jobid'));
});

Answer 2

您可以像這樣通過jQuery完成此操作：

$(".btn")click(function(){
var data = $(this).attr('data-jobid');
$(iframe).attr('src', data);
});