gpt4 book ai didi

javascript - getElementById 无法获取 html id 的值

转载 作者:行者123 更新时间:2023-11-28 04:52:48 25 4
gpt4 key购买 nike

如果我选择选择选项值 3,则显示 3 文本框。

1.这张图片是我想要的结果。 enter image description here

  • 但现在结果是这样的错误。 enter image description here
  • (使用 style_display_on(),可见/隐藏,无)但这不起作用。我错过了什么吗?

    (php数组转换为javascript数组,
    然后来自 php 的 count 数组被来自 javascript 的 getElementById 值使用......)

    <?php

    $arr[0] = "10.1.35.31";
    $arr[1] = "10.1.35.122";
    $arr[2] = "10.1.35.133";

    ?>

    <html>
    <head>
    <link rel="stylesheet" type="text/css" href="../css/main.css">
    <script type="text/javascript">

    function getR() {
    document.getElementById("ipcnt").value = "<?php echo count($arr); ?>";
    <?php
    for($i = 0; $i < count($arr); $i++) {
    echo "document.getElementById(\"" . "mmeremoteip" . $i . "\").value = \"" . $arr[$i]. "\";\n";
    }
    ?>
    }

    function mmeswitch(){

    <?php
    for($i = 0; $i < 8; $i++){
    echo "document.getElementById(\"mmeremoteip". $i . "\").style.visibility = \"hidden\";\n";
    echo "document.getElementById(\"mmeremoteip". $i . "\").style.display = \"none\";\n";
    }
    for($i = 0; $i < 8; $i++){
    echo "if( document.getElementById(\"ipcnt\").value == " . ($i+1) . " ) { \n";
    for($j = 0; $j < $i+1; $j++) {
    echo "document.getElementById(\"mmeremoteip". $j . "\").style.visibility = \"visible\";\n";
    echo "document.getElementById(\"mmeremoteip". $j . "\").style.display = style_display_on();\n";
    }
    echo "}\n";
    }
    ?>

    </script>
    </head>
    <body onLoad="getR();">
    <form name="save" method="post">
    <h1>TEST</h1>
    <table>

    <tr id="ipcnt"><td colspan="2">No. of IP</td>
    <td><select name="ipcnt" size="1" onChange="mmeswitch();">
    <?php
    for($i = 1; $i <= 8; $i++) {
    echo "<option value='". $i ."'>". $i ."</option>\n";
    }
    ?>
    </select></td>
    </tr>
    <?php
    for($i = 0; $i < 8; $i++) {
    echo "<tr id=\"mmeremoteip".$i."\"><td class=\"param\" colspan=\"2\">MME Remote IP" . ($i+1) . "</td>\n";
    echo "<td><input type=\"text\" name=\"mmeremoteip" . $i . "\" class=\"inputParam\" size=\"20\" maxlength=\"15\" value=\"".$arr[$i] ."\"></td></tr>\n";
    }
    ?>
    </table>
    </body>
    </html>

    最佳答案

    在这个 fiddle 中,我发布了一个用 vanilla js 编写的代码的工作示例。其js代码是:

    document.body.onload = init;
    let arr = [1,2,3,4,5]; // Array is from php like
    /*
    let arr = JSON.parse('<?php echo json_encode($arr); ?>'); // In case you don't know what is does read more about json
    */
    // function called when page is loaded
    function init () {
    // this creates textfields for each 'ip'
    for(let i=0;i<arr.length;i++){
    let el = document.createElement('input'); // create textfield
    el.setAttribute('type','text'); // set it to text field
    el.className = 'textField'; // set class for later use
    el.id = 'textField'+i; // set id
    el.value = arr[i]; // set value(IP)
    document.getElementById('container').appendChild(el); // add to the page
    }
    document.getElementById('textFieldSelect').addEventListener('change',onSelectChange); // add action to select
    onSelectChange(); // "trigger" select when page is loaded
    }

    function onSelectChange(){
    var val = document.getElementById('textFieldSelect').value; // how many textfields shall there be
    // hide all textfields
    document.querySelectorAll('.textField').forEach(function(elem,idx){
    elem.style = 'display: none';
    });
    //show exactly 'val' textfields
    for(let i = 0;i<val;i++){
    document.getElementById('textField'+i).style='display:block;';
    }
    }

    https://jsfiddle.net/tnrrhx0d/1/

    关于javascript - getElementById 无法获取 html id 的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42782111/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com