1

ステッカーを貼った掲示板のようなサイトをデザインしています。そのため、各ステッカーには閉じるボタンがあります。しかし、ユーザーが閉じるボタンをクリックしたステッカーのIDが見つかりません。

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
}
4

5 に答える 5

2

ステッカーは閉じるボタンに関連しているため、実際には ID は必要ありません。closest()メソッドと適切なセレクターを使用するだけです。

ただし、ID が必要かどうかに関係なく、ここではステッカーの閉じるボタンに動的ハンドラーを配置します。ステッカーはいくつでも追加できます。これにより、インラインの JavaScript 呼び出しがjavascript:anything廃止され、コードの保守が容易になります。

ここのハンドラーはコールバックとして deleteSticker を使用していますが、ID の取得 (アラートに表示) やステッカーの削除など、必要なことは何でもできます。

色付きステッカーのボーナスポイントは？:D

フィドル

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

$('#mainForSticks').on('click', 'a', deleteSticker);
于 2013-05-16T02:32:50.580 に答える