1

jqueryを使ってdiv要素を追加・削除したいのですが、div要素の追加はうまくいくのですが、div要素の削除がうまくいかないので、このように実装しました。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>jQuery</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

<script type="text/javascript">
var count = 0;
$(document).ready(function(){
    $('p#add_field').click(function(){
        count += 1;
        $('#container').append(
                '<div><div><label><strong>Link' + '</strong></label><br />' 

                + '<input id="field_' + count + '" name="fields[]' + '" type="text" /><br /></div>' 
                +'<div><a href="#" class="remove">Remove selection</a></div></div>  ');

    });

    $('.remove').on('click', function () {
        $(this).parent().parent().remove();
        return false;
    });

});
</script> 

<body>

        <div id="container">
            <p id="add_field"><a href="#"><span>&raquo; Add your favourite links.....</span></a></p>
        </div>

</body>
</html>

誰かが解決策を知っているなら、私を助けてください!!!

4

1 に答える 1

2

アイテムは動的に作成されており、を呼び出すと存在しません$('.remove').on('click',function () {。

次のようにスクリプトを変更してみてください。

$('#container').on('click','.remove',function () {
    $(this).parent().parent().remove();
    return false;
});
于 2012-07-04T14:37:00.677 に答える