ここで使用したい2つのjQuery関数があります。
1)click
。これは、唯一のパラメーターとして無名関数を取り、要素がクリックされたときにそれを実行します。
2)html
。これは、唯一のパラメーターとしてhtml文字列を取り、要素の内容を提供されたhtmlに置き換えます。
したがって、あなたの場合、あなたは以下をしたいと思うでしょう:
$('#content-container a').click(function(e){
$(this).parent().html('<a href="#">I\'m a new link</a>');
e.preventDefault();
});
div内のすべてを置き換えるのではなく、コンテンツをdivに追加するだけの場合は、次を使用する必要がありますappend
。
$('#content-container a').click(function(e){
$(this).parent().append('<a href="#">I\'m a new link</a>');
e.preventDefault();
});
新しく追加されたリンクをクリックしたときに新しいコンテンツも追加する場合は、イベント委任を使用する必要があります。
$('#content-container').on('click', 'a', function(e){
$(this).parent().append('<a href="#">I\'m a new link</a>');
e.preventDefault();
});