2016-04-25 18 views
0

私は口ひげとjqueryを使用してフォームを実装しようとしています。新しいフォームを追加して削除し、それぞれのフォームを削除するボタンを追加します。フォームのHTMLは口ひげを使用して行われ、すべてのフォームには削除ボタンがあります。これで、最初のフォームの削除アイコン/ボタンを削除します。MustacheテンプレートでJqueryの削除関数が機能しません

私はそれが私のために働い

output.find('.delete').remove(); 

を試してみました...私がやっている間違っているのかわから

$(document).ready(function() { 
    var output = $("#output");  
    var template = $("#test1").html(); 

    // var rendered = Mustache.render(template, {name: "Luke"}); 

    var customTemplate = Mustache.render(template, {bikename: "ABCD"}); 
    $(customTemplate).find('.delete').hide(); 

    output.append($(customTemplate)); 

     $('#addepod').on('click', function(){ 
      customTemplate = Mustache.render(template, {bikename: "New Bike"}); 

      output.append(customTemplate); 
    }); 

    $('#output').on('click','#deletepod',function() { 
     $(this).parent().remove(); 
     }); 
}); 

Fiddle Here

答えて

0

をjqueryのを使用して削除しようとしたが、働いていない、ではありません!

まだMustache Templateから要素を削除できない理由がわかりません。ご存知の方は、教えてください。あなたが最初のフォームから削除アイコンを削除したい場合は

0

EDIT

は、それを行うにはあなたの方法は良好でした。クリックハンドラを削除するだけです。

新しいフォームを追加すると、重複したIDが#deletepodになっています。代わりに良い仕事のためにクラスを使用する必要があります。

ここで修正HTMLの一部です:

<input type="button" class="delete" value="Delete"/> 

、修正JSの一部:

$('#output').on('click','.delete',function() { 
    $(this).parent().remove(); 
});  

$(".delete").first().remove(); 

Fiddle with class instead of duplicate ID

関連する問題