为了账号安全,请及时绑定邮箱和手机立即绑定

如何创建最初有 N 个 div 的 HTML 页面

如何创建最初有 N 个 div 的 HTML 页面

PHP
繁花不似锦 2023-06-24 17:06:27
我正在制作一个类似于具有多个步骤的表单的页面。但在此之前,我从之前的表单中取出一个数字 N,它代表表单的步骤数。每个步骤都需要一个“tab”类的特定 div。现在,我需要使用 Javascript 或 PHP 来将主 div 复制 N 次。<form id="regForm" action="/action_page.php">    <!-- One "tab" for each step in the form: -->    <div class="tab">        <h1>Register:</h1>        Name:        <p><input placeholder="First name..." oninput="this.className = ''" name="fname"></p>        <p><input placeholder="Last name..." oninput="this.className = ''" name="lname"></p>    </div> </form>
查看完整描述

2 回答

?
RISEBY

TA贡献1856条经验 获得超5个赞

此代码克隆 div N 次


<html>

<body>


    <div class="tab" id="id0">

        <p>Test Tab</p>

    </div> 


<script>

    // Get the element

    var elem = document.querySelector('#id0');


    //set n to the value form the previous page

    var n = 10;

    var i;

    for (i = 1; i < n; i++) {

        // Create a copy of it

        var clone = elem.cloneNode(true);


        // Update the ID

        clone.id = "id" + n;


        // Inject it into the DOM

        elem.after(clone);

    }


    

</script>


</body>

</html>


查看完整回答
反对 回复 2023-06-24
?
12345678_0001

TA贡献1802条经验 获得超5个赞

您可以占用一个 for 并重复您使用 POST 或 GET 带来的步骤数的 div


<!-- One "tab" for each step in the form: -->


<?php 


    $divs = $_POST('number_divs'); 

    

    for ($i = 1; $i <= $divs; $i++) { 

    

?>


<div class="tab">

    <h1>Register:</h1>

    Name:

    <p><input placeholder="First name..." oninput="this.className = ''" name="fname"></p>

    <p><input placeholder="Last name..." oninput="this.className = ''" name="lname"></p>

</div> 


<?php }  ?>


查看完整回答
反对 回复 2023-06-24
  • 2 回答
  • 0 关注
  • 131 浏览

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信