Question

我有一个包含从数据库中获取的记录的表。每个记录都有一个按钮，点击后会出现一个对话框。

<img src="<?php echo config_item('base_url'); ?>library/images/ui/buttons/delete.png" class="bookmark-delete" data-bookmark="<?php echo $array_bookmarks_for_manage['bookmark_id']; ?>" height="14" width="14" />

每个按钮都是一个图形，并附有一个数据属性，其中包含每条记录的ID。

我正在尝试将数据属性的值显示在对话框中。

我的代码： -

$(document).ready(function() {
    $("#dialogue").hide();
    $("a.action").attr("href", base_url + 'bookmarks/delete/' + **$('.bookmark-delete').data('bookmark')**);
    $('.bookmark-delete').click(function(event) {
        $("#dialogue").css( { position:"absolute", top: event.pageY+15, left: event.pageX-315 });
        $("#dialogue").show();
    });
    $('#close').click(function() {
        $("#dialogue").hide();
    });
});

而且：

$(document).ready(function() {
    $("#dialogue").hide();
    $("a.action").attr("href", base_url + 'bookmarks/delete/' + **$(this).data('bookmark')**);
    $('.bookmark-delete').click(function(event) {
        $("#dialogue").css( { position:"absolute", top: event.pageY+15, left: event.pageX-315 });
        $("#dialogue").show();
    });
    $('#close').click(function() {
        $("#dialogue").hide();
    });
});

还有这个：

$(document).ready(function() {
    $("#dialogue").hide();
    $("a.action").attr("href", base_url + 'bookmarks/delete/' + **$(this).attr('data-bookmark')**);
    $('.bookmark-delete').click(function(event) {
        $("#dialogue").css( { position:"absolute", top: event.pageY+15, left: event.pageX-315 });
        $("#dialogue").show();
    });
    $('#close').click(function() {
        $("#dialogue").hide();
    });
});

一切都没有快乐;每次尝试都会导致“未定义”或表中的最后一个记录ID。

除了检索每个例子的第三行的值之外，其他所有工作都是有效的，我为了强调而鼓励他们。

对话框位于表格之外和之后：

    <div id="dialogue">
        <h3>Delete Bookmark</h3>
        <p>Do you want to delete this Bookmark?</p>
        <div class="divider"></div>
        <ul class="buttons">
            <li><div id="button-link"><a class="button-link action" href="#">Delete</a></div></li>
            <li><div id="button-link"><a class="button-link" href="#close" id="close">Cancel</a></div></li>
        </ul>
        <div class="cleaner"></div>
    </div>

此外，这是一个JS Fiddle of what I have。请注意，由于某种原因，代码在JS Fiddle上根本不起作用，即使除了ID之外的所有内容都在本地工作。

有什么想法吗？

Answer 1

尝试

var bookmarkid = $(this).data('bookmark');    
$("a.action").attr("href", base_url+'bookmarks/delete/'+bookmarkid);

取代

$("a.action").attr("href", base_url + 'bookmarks/delete/' + $(this).attr('data-bookmark'));

Answer 2

尝试

$('.bookmark-delete').click(function(event) {
var yourDataAtr =         $(this).attr("data-bookmark");
    });

并使用yourDataAtr值

执行任何操作

Answer 3

两者

var data = $(".bookmark-delete").attr('data-bookmark');

和

var data = $(".bookmark-delete").data('bookmark');

返回所需的值。然后使用 -

 $("a.action").attr("href", base_url + 'bookmarks/delete/' + data);

如何通过jQuery从data属性中获取特定值

3 个答案: