如何获取特定元素的id

Question

我正在设计一个网站，就像有贴纸的公告牌。所以每个贴纸都有一个关闭按钮。但是我找不到贴纸的id，用户点击了close按钮。

stickerId = 1;
function createSticker(jsonNewSticker){     // receives json

    str = "<b>Email:</b> "+ jsonNewSticker.email+ 
    "</br> <b>Title:</b> "+ jsonNewSticker.title+
    "</br> <b>Summary:</b> "+ jsonNewSticker.summary+
    "</br> <b>Description:</b> "+ jsonNewSticker.description +
    "</br> <b>Entry expires: </b>" + jsonNewSticker.expiration_date;

    $("#mainForSticks").prepend("<div id= seq-"+ stickerId +" ></div>");
    $("#seq-"+ stickerId).attr("class","sticker");      
    $("#seq-"+ stickerId).html(str);

    $("#seq-"+ stickerId).append("<div id=report><a class=link href=javascript:reportCounter()>Report</a></div>"); // report  
    $("#report").attr("class","reportText");

    $("#seq-"+ stickerId).append("<div id=deleteSticker><a class=link href=javascript:deleteSticker()><b>X</b></a></div>"); // delete 
    $("#deleteSticker").attr("class","delSticker");
    //currentId = $(this).attr('id');
    stickerId++;

}

所以这里的每个贴纸都有一个id: seq-1 seq-2 seq-3 ...

function deleteSticker(){
    // how can I get id of specific sticker
}

Answer 1

您可以通过两种方式来实现这一点。

第一种方法是将参数传递给它，如下所示：

$("#seq-"+ stickerId).append("<div id=deleteSticker><a class=link href=javascript:deleteSticker(" + stickerId +")><b>X</b></a></div>"); // delete 

function deleteSticker(ID){
    var x = $("#" + ID);
}

第二种方式是starts with selector，比如：

$(function(){
    $('div[id^="#seq-"]').click(function(){
       // here is your click.
    });
});

Answer 2

贴纸是相对于close按钮的，所以您实际上不需要ID，我只使用closest()方法和适当的选择器。

但是，无论您是否需要ID，我都在这里的贴纸关闭按钮上放置了一个动态处理程序。您可以添加任意数量的贴纸。这会使您对javascript:anything的内联javascript调用过时，从而使代码更易于维护。

这里的处理程序使用deleteSticker作为其回调函数，但您可以在其中执行任何操作，包括获取ID (我在警报中显示)或删除贴纸，等等。

带有颜色的贴纸的加分？:D

Fiddle

var deleteSticker = function(){
    var sticker = $(this).closest('[id^="seq"]');
        alert("your sticker # is: "+sticker.attr('id'));
    sticker.remove();
}

$('#mainForSticks').on('click', 'a', deleteSticker);

Answer 3

您可以在deleteSticker函数中传递Id并按如下方式使用它

function deleteSticker(item){
 var element=document.getElementById(item)
}

并像这样添加这个函数

var elementId="seq-"+ stickerId;
$("#seq-"+ stickerId).append("<div id=deleteSticker><a class=link href=javascript:deleteSticker(elementId)><b>X</b></a></div>"); // delete