是潘潘吖。 2022-06-25 09:18 采纳率: 40%
浏览 21
已结题

ajax怎么不确定个append添加上去的信息封装起来

ajax怎么不确定个append添加上去的信息封装起来.
在html页面中放一个添加按钮，用户点击一下添加按钮，就出现一个添加信息的框，用户在框里输入要添加的信息，他出来新的框的html代码是用jquery的append方法做的。不确定用户会添加多少条信息，怎么在ajax中，将用户添加的所有信息取出来封装成一个对象？

  • 写回答

2条回答 默认 最新

  • Heerey525 前端领域新星创作者 2022-06-25 11:01
    关注
    <!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <style>
      body {
        width: 750px;
        height: 600px;
      }
    </style>
  </head>
  <body>
    <div id="container"></div>
    <button onclick="add()">添加</button>
    <button onclick="submit()">提交</button>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    <script>
      var num = 0; //用来标识添加的为第几个input
      function add() {
        $("#container").append(`<input class="input${num}" type="text">`);
        num++;
      }
      function submit() {
        var result = [];
        for (let index = 0; index < num; index++) {
          result.push($(`.input${index}`).val());
        }
        console.log("获取到的所有的input值", result);
      }
    </script>
  </body>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题？

问题事件

  • 系统已结题 7月7日
  • 已采纳回答 6月29日
  • 创建了问题 6月25日