Question

以下代码用于重复div。但它不起作用。请帮帮我。

<html>
  <head>
    <script>
      $(".repeat").live('click', function () {
        var $self = $(this);
        $self.after($self.parent().clone());
        $self.remove();
      });
  </script>
  </head>
  <body>
    <form>
      <div class="repeatable">
        <table border="1">
        <tr><td><input type="text" name="userInput[]"></td></tr></table>
        <button class="repeat">Add Another</button>
      </div>
    <input type="submit" value="Submit">
    </form>
  </body>
</html>

Answer 1

首先在jquery中添加code，然后使用on()代替live()。

还要在$(function(){...})中编写代码，以便您的代码在document ready

之后运行

<script src="http:/code.jquery.com/jquery-1.9.1.js"></script>
<script>
   $(function () {
       $(".repeat").on('click', function () {
          var $self = $(this);
          $self.after($self.parent().clone());
          $self.remove();
       });
   });
</script>

Working Demo

已更新，如果您希望它适用于more inputs，请尝试此操作，

$(function () {
    $(".repeat").on('click', function (e) {
        e.preventDefault();// to prevent form submit
        var $self = $(this);
        $self.before($self.prev('table').clone());// use prev() not parent()
        //$self.remove();// remove this line so you can add more inputs
    });
});

Updated Demo

Answer 2

使用

$(document).on('click', '.repeat', function () {

而不是

$(".repeat").live('click', function () {

Answer 3

$(".repeat")构造说必须使用jQuery。尝试在<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

之前添加<script>

Answer 4

试试这个

<强> HTML

<body>
    <form>
        <div class="parent">
      <div class="repeatable">
        <table border="1">
        <tr><td><input type="text" name="userInput[]"></td></tr></table>
        <button class="repeat">Add Another</button>
      </div>
      </div>
    <input type="submit" value="Submit">
    </form>
  </body>

<强> Jquery的

$(document).on('click', '.repeat', function (e) {
    e.preventDefault();
    $('.repeatable').parent('div.parent').append($('.parent').children('div:first').html());
});

请参阅jsfiddle，

单击按钮时重复div

4 个答案: