在具有相同ID的多個錨點中單擊“獲取錨點”

Question

我有一個php循環，可多次打印錨點：

<div class="hidden-phone visible-desktop action-buttons">
    <a class="red" href="#" id="d_id" data-value="<?php echo $row['id'];?>">
        <i class="icon-trash bigger-130" id="bootbox-confirm"></i>
    </a>
</div>

而且我有此JQuery代碼來獲取已單擊的鏈接：

     <script type="text/javascript">
        $(function() {
            $("#d_id").on(ace.click_event, function() {
                var x = $(this).attr('data-value');
                bootbox.confirm(x, function(result) {
                    if(result) {
                        bootbox.alert(x);
                    }
                });
            });
       })
    </script>

這項工作僅適用於第一個錨點

任何幫助將不勝感激

Answer 1

更改類的ID，因為ID是唯一的，因此，第一個具有該ID的元素將成為jquery唯一考慮的元素：

<div class="hidden-phone visible-desktop action-buttons">
    <a class="red d_id" href="#" data-value="<?php echo $row['id'];?>">
        <i class="icon-trash bigger-130" id="bootbox-confirm"></i>
    </a>
</div>

 <script type="text/javascript">
    $(function() {
        $(".d_id").on(ace.click_event, function() {
            var x = $(this).attr('data-value');
            bootbox.confirm(x, function(result) {
                if(result) {
                    bootbox.alert(x);
                }
            });
        });
   })
</script>

Answer 2

您不應有多個具有相同ID的div，將其更改為class，然后在click事件選擇器上輸入“ .d_id”。

另外，使用$（this）可以獲取實際單擊的元素，這意味着'this'可以是您在那里擁有的圖標元素，而不是您想要的圖標元素。

因此，您可以執行以下操作：

$("#d_id").on(ace.click_event, function() {
    var x = $(this).attr('data-value');
    if (typeof x === 'undefined'){
        x = $(this).parent().attr('data-value');
    }
    ...
});

像這樣的東西:-)