將ID值傳遞給具有彈出式窗口的外部函數

Question

我一直在嘗試將ID值傳遞給另一個函數。

JQuery的：

$('a.btnPopClass').popover({ 
      placement: 'right', 
      html: true, 
    content: 'Are you sure?<br><br><a class="btn btn-danger btn-block" id="click-me">Yes</a>' 
}).parent().on('click', '#click-me', function() { 
    delete_row(id); 
}); 

HTML：

<a type="button" data-id="<?php echo $row['id']; ?>" class="btnPopClass btn btn-danger btn-block">Remove</a> 

按鈕獲取值的數據ID，我想這個值傳遞給delete_row（）函數。我一直在試驗 $（this）.data（'id'），但我無法想象如何以我的方式解決問題。

Answer 1

您可以添加一個單擊事件，將該ID設置爲data屬性。

.click(function() { 
    $(this).next(".popover").find("a").attr("data-id",$(this).data("id")); 
}) 

$('a.btnPopClass').popover({ 
 
    placement: 'bottom', 
 
    html: true, 
 
    content: 'Are you sure?<br><br><a class="btn btn-danger btn-block" id="click-me">Yes</a>' 
 
}).click(function() { 
 
    $(this).next(".popover").find("a").attr("data-id",$(this).data("id")); 
 
}).parent().on('click', '#click-me', function() { 
 
    alert($(this).data("id")); 
 
});

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> 
 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<a type="button" data-id="2" class="btnPopClass btn btn-danger btn-block">Remove</a>

Answer 2

我會分配一個id，你的刪除按鈕，以便您可以搜索並得到你已經分配給它的ID。確切地說，這將找到RemoveAction按鈕，而不是在你的頁面的所有A鏈接的：

$('a.btnPopClass').popover({ 
 
      placement: 'right', 
 
      html: true, 
 
    content: 'Are you sure?<br><br><a class="btn btn-danger btn-block" id="click-me">Yes</a>' 
 
}).parent().on('click', '#click-me', function() { 
 
\t \t alert($('#RemoveAction').data('id')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" rel="stylesheet"/> 
 
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/css/tether.min.css" rel="stylesheet"/> 
 
<a type="button" data-id="50" id="RemoveAction" class="btnPopClass btn btn-danger btn-block">Remove</a>

工作小提琴：https://jsfiddle.net/HappyiPhone/2mrsgsow/