Question

我从数组生成PHP的div，因此：

echo "<div id='parentdiv'>";
 for($counter = 0; $counter < count($list); $counter++){
         echo "<div>".$list['important_info']."</div>";

   }
  echo "</div>";//parentdiv

我想单独为每个div添加一些点击功能，即点击时执行的操作取决于div，更重要的是数组的索引，$ list;

我想根据它在PHP数组中的索引给每个div一个id。所以我可以做到

echo "<div id='"."divindex_".$counter."'>".$list['important_info']."</div>";

其中“divindex_”仅用于防止以数字值开头的id形式。

然后，我认为在jQuery中我可以为每个div编写点击函数。

然而问题是$ list size是可变的，所以我不知道有多少div。所以我在想的是，

 $("#parentdiv div").click(function(){
            var id = split($(this).attr('id').split("_")[1];//get the php index from the id
            //do something with the id, e.g. ajax or whatever
　　});

有更好的方法吗？如果你认为我正在做的事情很奇怪而且不是一个好主意，那么我理解。但我不知道如何以其他方式做到这一点。任何帮助表示赞赏。

Answer 1

只需使用：

$("#parentdiv div").click(function(){
            var id  = $(this).index(); //index of div, 0 based
            var val = $(this).text();  //content of div, if you need it
});

无需添加唯一的ID s :)。

演示： http://jsfiddle.net/q9TaJ/

文档： http://api.jquery.com/index/

Answer 2

首先，确保正确地逃避输出：

echo '<div id="parentdiv">';
for ($counter = 0; $counter < count($list); $counter++){
    echo sprintf('<div data-id="%d">%s</div>',
        $counter,
        htmlspecialchars($list['important_info'])
    );
}
echo '</div>';//parentdiv

我还使用了一个名为data-id的特殊属性，您可以使用以下代码轻松访问jQuery：

$('#parentdiv > div').on('click', function() {
    var id = $(this).data('id');
});

Answer 3

您可以将变量作为html属性传递。然后将click事件绑定到单个类。

<div class="divs" data-id="myid"></div>

在jquery中

 $('.divs').click(function(){
console.log($(this).data('id));    
});

使用jQuery从PHP生成的列表中通过id调用各个Div

3 个答案: