青衣 发表于 2021-8-6 11:19:18

JQuery动态增加删除元素

<form action="" method="post" enctype="multipart/form-data">

      <label>请选择上传的图片</label> <a href="javascript:addimg()">增加图片</a>

      <div class="mdiv" id="mdiv">

            <div class="iptdiv">
                <input type="file" name="img[]" class="ipt" /><a href="#"
                  name="rmlink">XXX</a>
            </div>

      </div>

      <input type="submit" name="submit" value="上传图片" />
    </form>

    <script type="text/javascript">
      $(document).ready(function() {
            bindListener();
            
      })

      function addimg() {
            $("#mdiv").append(
                            '<div class="iptdiv" ><input type="file" name="img[]" class="ipt" />'+
                            '<a href="#" name="rmlink">XXX</a></div>');
            //为新元素节点添加事件侦听器
            bindListener();
            
      }
      
      function bindListener(){
            $("a").unbind().click(function(){
                $(this).parent().remove();
            })
            
      }
    </script>


文档来源:51CTO技术博客https://blog.51cto.com/beyang/3271462
页: [1]
查看完整版本: JQuery动态增加删除元素