Question

我正在生成一个菜单，其中包含foreach select查询<li>生成的列表项。

我正在打印这个名字＆＃39;每一行。但是，我还想在变量中存储来自该行的其他一些数据，所以当我点击$query = "SELECT * FROM credenciais_sensores where ambiente = '1'"; $results = mysqli_query($conn, $query); <ul class="treeview-menu"> <?php foreach ($results as $result) { $local = $result['local']; $local = substr($local,0,7); echo "<li><a class='post' href='#'>".$local."</a></li>"; }?> </ul>时，我会得到那些特定的变量。

我想使用Javascript执行此操作，因此我不会重新加载页面。

这是我到目前为止的代码：

 "truck": {
        "number": "9999",
        "type": "FM",
        "vinNumber": "vin750",
        "licensePlate": {
            "number": "12345",
            "stateProvince": "IN"
        }
    },

我怎样才能做到这一点？

Answer 1

这是代码

<ul class="treeview-menu">
   <?php
    foreach ($results as $result){
         $local = $result['local'];
         $local = substr($local,0,7); ?>
         <li><a class="post" href="#<?=$local;?>"><?=$local;?></a></li>
         <div id="<?=$local;?>">some details...</div>
    <?php } ?>
</ul>

 <?php  foreach ($results as $result){
             $local = $result['local'];
             $local = substr($local,0,7); ?>
             <div id="<?=$local;?>">some details...</div>
  <?php } ?>

Answer 2

如果我说得对，你想要将数据从DB /后端绑定到你在foreach循环中创建的每个菜单的项目元素，然后在项目元素点击事件上，获取项目＆＃ 39;具体数据。如果那是你的意思那么有多种方法可以去。现在，我将向您展示一个示例：当您创建项目元素时，您可以创建数据属性以将数据保存为stringify对象并在点击事件上解析它，在PHP部分我创建一个带有内部数组的模拟结果数组，例如＆＃34; other_data＆＃34; key包含要绑定到item元素的数据，然后在foreach循环中我们添加＆＃34; data-other＆＃34; attribute包含其他数据作为strigify对象。我已经承诺了＆＃34; substr＆＃34;对于该示例的函数，您可以稍后取消它。新的div与＆＃34;显示数据＆＃34; id仅用于在点击事件上打印每个项目的数据：

<ul class="treeview-menu">
<?php
$results = array(
    array(
        'local' => 'some local 1',
        'other_data' => array(
            'other_data1' => 'some other data 1 from local 1',
            'other_data2' => 'some other data 2 from local 1'
        )
    ),
    array(
        'local' => 'some local 2',
        'other_data' => array(
            'other_data1' => 'some other data 1 from local 2',
            'other_data2' => 'some other data 2 from local 2'
        )
    )
);
$item = '';
foreach ($results as $result){
    $local = $result['local'];
    //$local = substr($local,0,7);
    $other_data = json_encode($result['other_data']);
    $item .= "<li><a class='post' href='#' data-other='$other_data'>$local</a></li>";
}
echo $item;
?>
</ul>
<div id="display-data"></div>

在JS部分中，我们在所有菜单的项目元素上运行for循环并添加click事件，这样当我们点击一个项目时我们将获得特定数据，然后我们解析它因此我们可以将它用作对象，在示例中，我们将点击事件中的项目特定数据作为div元素中的字符串打印（＆＃34; display-data＆＃34; id）：

(function(){
    var item = [], item_data = '', item_data_obj = {}, display = {};
    document.addEventListener('DOMContentLoaded', function(){
        display = document.getElementById('display-data');
        item = document.getElementsByClassName('post');
        for (let i = 0; i < item.length; i++){
            item[i].addEventListener('click', function(){
                item_data = this.getAttribute('data-other');
                item_data_obj = JSON.parse(item_data);
                display.innerHTML = this.innerHTML + ' :' + item_data;
            })
        }
    })
})()

从foreach生成的项目中获取变量

2 个答案: