jquery动态添加删除div 具体实现

复制代码 代码如下:

  <script type=”text/javascript” src=”jquery.js”></script>

  <body>

  <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”>X</a>

  </div>

  </div>

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

  </form>

  <script type=”text/javascript” >

  $(document).ready(function(){

  bindListener();

  });

  // 用来绑定事件(使用unbind避免重复绑定)

  function bindListener(){

  $(“a[name=rmlink]“).unbind().click(function(){

  $(this).parent().remove();

  })

  }

  function addimg(){

  $(“#mdiv”).append(‘<div class=”iptdiv”><input type=”file” name=”img[]” class=”ipt” /><a href=”#” name=”rmlink”> X </a></div>');

  // 为新元素节点添加事件侦听器

  bindListener();

  }

  </script>