Question

我无法在代码上获得所需的结果。当我遍历数据数组时，JavaScript只对第一个回显数据起作用。

代码段：

     <?php

                    $ids = array();


                    array_push($ids, getRandom($id));
                    array_push($ids, getRandom($id));
                    array_push($ids, getRandom($id));

                    $ids = array_unique($ids);
                    if (count($ids) > 0) {
                    foreach($ids as $value => $val) {

                        //data saved in variables


                        <li>
                            <div class="row">
                                <div class="col-xs-3">
                                    <div class="avatar">
                                       <!--avartar -->
                                    </div>
                                </div>
                                <div class="col-xs-6">
                                   <!-- data -->
                                </div>
                                <div class="col-xs-3 text-right">
                                    <button id = "button1" class="btn btn-xs btn-warning btn-icon"><i class="fa  fa-plus"></i></button>
                                </div>
                            </div>
                        </li>
                        <?php
                        }
                    }
                    ?>

JavaScript的：

 <script>
                 $("#button1").on("click",function() {
                     alert("hey");
                 });
</script>

Answer 1

id应该是唯一的，请尝试使用类。

大多数浏览器在javascript中选择ID时都遵循标准，并仅使用第一个元素回复您。

尝试删除ID

<div class="col-xs-3 text-right">
  <button class="btn btn-xs btn-warning btn-icon"><i class="fa  fa-plus"></i></button>
</div>

然后：

$(".btn").on("click",function() {
   alert("hey");
});

Answer 2

尝试更改JavaScript函数以适用于任何按钮点击：

$("button").on("click",function() {
    alert("hey");
});

同样值得注意的是，你不应该为多个元素使用相同的ID：

<button id = "button_<?= $val ?>" class="btn btn-xs btn-warning btn-icon"><i class="fa  fa-plus"></i></button>

这将为每个按钮元素

创建一个唯一的ID

当我遍历MySQL数组时，JavaScript会处理第一个回显数据

2 个答案: