javascript不能以动态形式工作

Posted 2023-05-09

【中文标题】javascript不能以动态形式工作

【英文标题】：javascript not working in dynamic form

【发布时间】：2017-07-01 20:29:42

【问题描述】：

我有一个显示来自数据库的数据的动态表单和一个用于显示和隐藏某些字段的 javascript 代码，但 javascript 代码仅适用于第一个结果 这是php代码

<?php
                $arr = select::mobiles($id);
                foreach ($arr as $aa)  ?>
                <div class="col-sm-10">
                    <div class="col-sm-2 bring_right">
                        <input type="hidden" name="p_name2[<?php $counter; ?>]"
                               value="<?php echo $aa['name']; ?>"><?php echo $aa['name'] ?>
                    </div>
                    <div class="col-sm-4 bring_right">
                        <input type="radio" id="general_radio" name="">
                        <label for="">general</label>
                        <input type="radio" onclick="showMe('variant', this)" id="variant_radio" name="">
                        <label for="">variant</label>
                    </div>
                    <div class="col-sm-6 bring_right" id="variant" style="display: none">
                        <?php
                        $branches = select::mobile_branches();
                        //                            print_r($branches);
                        foreach ($branches as $b) 
                            ?>
                            <div class="col-sm-4 bring_right"><label for=""><?php echo $b['name'] ?></label></div>
                            <div class="col-sm-8">
                                <select class="form-control input-sm"
                                        name="p_value[<?php echo $aa['name']; ?>][<?php $counter; ?>]">
                                    <?php
                                    $pid = select::property($aa['name']);
                                    $arr2 = select::properties($pid);
                                    foreach ($arr2 as $aa2)  ?>
                                        <option value="<?php echo $aa2['name'] ?>" style="direction:ltr">
                                            <?php echo $aa2['name'] ?></option>
                                    <?php 
                                    $counter++; ?>
                                </select>
                            </div>
                        <?php  ?>
                    </div>
                    <div class="col-sm-3 bring_right" id="general">
                        <select multiple class="form-control input-sm"
                                name="p_value[<?php echo $aa['name']; ?>][
                <?php $counter; ?>]">
                            <?php
                            $pid = select::property($aa['name']);
                            $arr2 = select::properties($pid);
                            foreach ($arr2 as $aa2)  ?>
                                <option value="
                <?php echo $aa2['name'] ?>">
                                    <?php echo $aa2['name'] ?></option>
                            <?php 
                            $counter++; ?>
                        </select>
                    </div>
                </div>
            <?php  ?>

而javascript代码是

<script type="text/javascript">
function showMe(it, box) 
    var vis = (box.checked) ? "block" : "none";
    document.getElementById(it).style.display = vis;
    $('#general').hide();


</script>

有什么帮助吗？？

【问题讨论】：

您能在此处添加任何错误吗？ （使用浏览器开发者选项中的控制台）查看错误

我在控制台中没有错误.. 代码已经可以工作，但只有第一个字段

【参考方案1】：

嘿，我想我有你的问题。在你的代码中看到这部分

foreach ($arr as $aa)  ?>
                ......
<div class="col-sm-6 bring_right" id="variant" style="display: none">

在这里，您有多个 div 的相同 ID，只需尝试以下更改，您就可以做到这一点

foreach ($arr as $key => $aa)  ?>
                    ......
<input type="radio" onclick="showMe('variant<?php echo $key; ?>', this)" id="variant_radio" name="">
........
<div class="col-sm-6 bring_right" id="variant<?php echo $key; ?>" style="display: none">

如果我不明白你的意思或者它不起作用，请告诉我。

【讨论】：

感谢您的代码完美运行.. 非常感谢您的帮助

但我还有更多问题......你的代码适用于二维数组，我有一个 3 维数组我应该怎么做？？

是的，是的，是的，我做到了……我按照你的步骤，使代码适用于 3 维数组，非常感谢

np，只是为其他人添加。当我们深入维度时，我们可以连接数组的键，这有助于为每个 div 创建 diff id。