Question

我有这张桌子：

以下是此页面的代码：

<?php 
include('footer.php');
include('../models/fetchQuotes.php');
$content = file_get_contents("http://test/MY_API/getAllTopics");
$arrayId = array();
$arrayName = array();
$arrayImg = array();
foreach (json_decode($content, true) as $eventrType => $events) {
    array_push($arrayId, $events[id]);
    array_push($arrayName, $events[name]);
    array_push($arrayImg, $events[img]);
}
?>
<div class="container">
    <table class="table">
        <thead>
            <tr>
                <th>ID</th>
                <th>Name</th>
                <th>Img</th>
                <th>Option 1</th>
            </tr>       
        </thead>
        <tbody>
            <?php for ($i=0;$i<count($arrayId);$i++) { ?> 
            <tr>
                <td><?php echo ($arrayId[$i])." "; ?></td>
                <td><?php echo ($arrayName[$i])." "; ?></td>
                <td><img src="<?php echo ($arrayImg[$i])." ";?>" alt="" width="75", heigth="75"></td>
                <td> <button class="btn btn-danger" id="deleteById" value=<?= ($arrayId[$i]); ?> onclick="myFunction()">DELETE</button>
                    <div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                                    <h4 class="modal-title" id="myModalLabel">Ошибка</h4>
                                </div>
                                <div class="modal-body" id ="modal-body">

                                </div>
                                <div class="modal-footer">
                                    <button type="button" class="btn btn-default" data-dismiss="modal">Закрыть</button>
                                </div>
                            </div>
                        </div>
                    </div></td>
                </tr><?php } ?> 
            </tbody>
        </table>
    </div>
    <script> 
    function myFunction(){
       var deleteById = document.getElementById('deleteById').value;
       alert(deleteById);
    }
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="../js/bootstrap.min.js"></script>

我解析自己的API，然后将其填入表格中。现在，当我点击任何按钮DELETE时，每次我都有相同的警报“12”。我明白为什么会发生，但我无法弄清楚如何使其正确。如何将每个按钮与相应的单元ID相关联？对不起语言错误，感谢您的帮助。

Answer 1

问题是你在一个页面中只能有一个id，但是当你在循环中给那个按钮一个id时，不同的元素会得到相同的id。

要解决此问题，您始终可以使用课程。但是你根据你的方法使用这样的东西。

    <button class="btn btn-danger" onclick="myFunction(<?= ($arrayId[$i]); ?>)">DELETE</button>

并在javascript中

    function myFunction(id){
        alert(id);
    }

我希望这会对你有所帮助。

干杯：）

Answer 2

我建议你将当前ID作为函数参数传递：

<button class="btn btn-danger" value=<?= ($arrayId[$i]); ?> onclick="myFunction(<?= ($arrayId[$i]); ?>)">DELETE</button>

功能签名将是：

function myFunction(idToDelete){
   alert(idToDelete);
}

我也会从id删除button属性，因为它不是必需的。如果您希望将来为多个元素使用相同的ID - 不要，因为html页面上的ID 必须是唯一的。

Answer 3

please change your code as per image it will work

使用按钮php从id中删除表中的元素

3 个答案: