Javascript 在jQuery中使用动态div id

我有一个容器，里面最多有20个项目，每个项目从SQL数据库和自己的div中获取信息（如图像），id为

suit(1-20）

以下代码中列出了这些项目：

<?php 
    $d = 1;
?>
<table >
    <tbody>
    <?php while $item = sqlsrv_fetch_object($user_item) : ?>
        <td align="center" height="50" width="21%">
            <div class="tooltips" href="">
                <div class="suitable" id="suit_<?php echo $d++ ?>" name="<?php echo $myDBID ?>">
                    <img src="images/icon/<?php echo $item->Img ?>">
                </div>
            </div>
        </td>   
    <?php endwhile; ?>  
    </tbody>
</table>

jQuery(function($) {
    $('[id^="suit_"]').each(function(){
    var object = this;
    $(object).contextPopup({
        items : [{
            label : 'Set',
            action : function () {
                window.location.href = "?settest=" + object.id
            }
        },
        null, 
        {
            label : 'Throw',
            action : function () {
                window.location.href = "?throwtest=" + object.id
            }
        },
        ]
    });
    });
});

我有一个for循环，它应该从1计数到20，并生成相应的id（

suit_1

到

suit_20

）

不知何故，脚本只对容器中的最后一个项目有效，因此如果我有10个项目，那么所有项目都将获得ID

suit\u 10

---

有什么想法吗？

为什么不去掉这个循环，然后用一个

使用

^=

选择器显示“以开头的任何内容”：

---

我通过为选择器添加

each（function（））

并在事件开始之前设置变量

object

解决了这个问题

以前的解决方案的问题是子函数

action : function () {
   window.location.href = "?settest=" + ID
}

这导致

$（此）

无法工作

请参阅下面的完整代码：

<?php 
    $d = 1;
?>
<table >
    <tbody>
    <?php while $item = sqlsrv_fetch_object($user_item) : ?>
        <td align="center" height="50" width="21%">
            <div class="tooltips" href="">
                <div class="suitable" id="suit_<?php echo $d++ ?>" name="<?php echo $myDBID ?>">
                    <img src="images/icon/<?php echo $item->Img ?>">
                </div>
            </div>
        </td>   
    <?php endwhile; ?>  
    </tbody>
</table>

jQuery(function($) {
    $('[id^="suit_"]').each(function(){
    var object = this;
    $(object).contextPopup({
        items : [{
            label : 'Set',
            action : function () {
                window.location.href = "?settest=" + object.id
            }
        },
        null, 
        {
            label : 'Throw',
            action : function () {
                window.location.href = "?throwtest=" + object.id
            }
        },
        ]
    });
    });
});

---

这实际上是非常好的，将有助于进一步的项目，不幸的是，整个下拉菜单停止工作，如果我使用这个选择器。我还尝试了$（div'[id^=“suit撸”]”，就像您刚才提到的站点一样，问题仍然存在。我注意到现在选择器的工作方式很有魅力，实际问题是事件处理程序中的“var id=$（this）.attr（'id'）；”。如果我把它移除，下拉菜单可以正常工作，但是在外面我和以前一样有同样的问题。啊，我看到了这个问题。待命，谢谢你等一下。遗憾的是，今天我已经讨论过这个问题好几次了。我通过您的编辑更改了代码，至少下拉列表再次工作，但不知何故，实际的div容器ID无法识别，因为我在单击菜单按钮时得到了“？settest=undefined”。另外，$（event.target）也显示了相同的结果。似乎contextPopup函数正在控制“this”-在不深入该代码的情况下，这变得更加复杂。我的解决方案可能不起作用，它可能是你毕竟需要你的循环（我认为这是蹩脚的）。问题-在您自己的代码中，为什么不这样调用var-ID:

var-ID='suit_'+count？那会有帮助吗？