PHP(CakePHP)とjQueryでコメント機能を作っています。
下記のようなコードで、formからpostされた内容を飛ばして、非同期処理を行い
class="testList"
のarticle
要素の一番下に送信したコメントの入ったElements(HTML)を挿入し、
リロードなしで送信したコメントが新しく表示されるようにしています。
ただ、連投しようとすると動かず、1度送信して再度コメントする場合にリロードが必要になります。
このような事が起きるのはなぜなのでしょうか?
また、どのように解決すればよいか、ご教授頂けますと幸いです。
よろしくお願い致します。
html
1 <script> 2 $("form").submit(function() { 3 event.preventDefault(); // form側のPOSTをキャンセル 4 var content = $('textarea[name="test"]').val(); 5 $.ajax({ 6 type : "POST", 7 url : "/example", 8 data : {'test' : test}, 9 dataType : "text" 10 }).done(function(data, textStatus, jqXHR){ 11 $(".testList article:last-of-type").after(data); 12 }) 13 }); 14 </script>
【追記】 コメント部分のHTMLです。送信した後、<article>〜</article>の部分が非同期で挿入されます。
html
1 2 <div class="testList"> 3 <h2>コメント欄</h2> 4 <article> 5 <div class="test"> 6 <span class="postername">投稿者名</span> 7 <p class="content"> 8 コメント内容 9 </p> 10 </div> 11 </article> 12 </div>
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2017/10/30 03:17
2017/10/30 03:40 編集
2017/10/30 08:52