附加按钮的onclick不火的Jquery(appended button onclick don&

我有一个按钮，用于追加2个文本框，并在表TD的按钮，但问题是，在所附的按钮的onclick功能不火。 任何人看到这个问题？ 码：

<script>
    $(document).ready(function(){
        $("#add").click(function() {
            $(".no_border").append("<br /><label>Co-author email:</label><input type='text' name='author_email'/><label>Co-author Level:</label><input type='text' name='author_level'/><input id='save' type='button'name='save' value='Add'/>");
    });
});
</script>
<?php
    while($row = mysql_fetch_assoc($co_authors)) {
        echo "<tr>
            <td>{$row['author_email']}</td>
            <td>{$row['coauthor_level']}</td>";
            ?><td><button class='remove' id='remove' name='remove' email="<?php echo $row['author_email'] ?>"
            paper="<?php echo $row['paper_id'] ?>">Remove</button></td>
            </tr><?
            ?><td colspan="3" class="no_border"><button class="add" name="add"></button>
            <label id="add" class="cursor_pointer"> Add more co-authors</label></td><?
    }
?>

Answer 1:

您将需要使用jQuery的.on()的功能来访问DOM加载后创建的元素。

更具体的信息可以在jQuery的手册在这里找到： http://api.jquery.com/on/

$( document ).on( "click", "#add", function() {
    alert("aaaaaaaaaaa");
} ); 

jQuery中<1.7，这是以前使用的，如下所示：

$( "#add" ).live( "click", function( e ) {} );

Answer 2:

也许你必须使用。对或.live（） ，它们使脚本识别后创建的元素$(document).ready()被调用。

例如：

jQuery的1.7之前

$("#add").live("click", function() {
    ...

jQuery的1.7和更高

$("#add").on("click", function() {
    ...

Answer 3:

总结你的代码在jQuery的文件ready功能：

$(function() {
   $("#add").click(function() {
      $(".no_border").append("<br /><label>Co-author email:</label><input type='text' name='author_email'/><label>Co-author Level:</label><input type='text' name='author_level'/><input id='save' type='button'name='save' value='Add'/>");
   });
});

有关详细信息，请参阅： http://api.jquery.com/ready/

或者，也可以使用。对或.live （ .on是从1.7优选的方法）。

   $(document).on('click', '#add', function() {
      $(".no_border").append("<br /><label>Co-author email:</label><input type='text' name='author_email'/><label>Co-author Level:</label><input type='text' name='author_level'/><input id='save' type='button'name='save' value='Add'/>");
   });

   $("#add").live('click', function() {
      $(".no_border").append("<br /><label>Co-author email:</label><input type='text' name='author_email'/><label>Co-author Level:</label><input type='text' name='author_level'/><input id='save' type='button'name='save' value='Add'/>");
   });

文章来源: appended button onclick don't fire Jquery