0

トグルは、この名前付きクラスを持つすべての要素に適用されます。これを、クリックした要素のみに変更するにはどうすればよいですか?

<input type="file" id="file-input" multiple>
<div id="file-list">
</div>

$('#file-input').change(function(e) {
  for (var i = 0, f; f = files[i]; i++) {

      var reader = new FileReader();
      reader.readAsBinaryString(f);
      ....

      reader.onload = function(e) {
         var label1, text1="Text1", labelEdit;
         label1 = '<span class="editable">' + text1 + '</span> + 
                  '<input class="editable" type="text" style="display:none">'
         labelEdit = "<a class="edit">Edit</a> 

         $('file-list').append(label1, labelEdit);             

     }
   }
}

$('.edit').click(function() {
     $(this).closest('.editable').toggle();
     alert('clicked');
});

「編集」リンクの前にラベルと入力を切り替えようとしています。なぜかクリック音が鳴らない。私は何が欠けていますか？

4

1 に答える 1

0

すべてのラベルと入力をタグにラップしてから、spanクリックイベントを使用してクリックしたターゲット要素を取得し、このターゲットを使用して、JQueryprev()メソッドで前の兄弟を取得して切り替えることができます。

コードでは、次のようになります。

// your code here
label1 = '<span><span class="editable">' + text1 + '</span> + 
         '<input class="editable" type="text" style="display:none"></span>';
labelEdit = "<a class="edit">Edit</a>"; 
// some code again

その後、このように

$('.edit').click(function (e) {
    $(e.target).prev().toggle();
});
于 2016-04-27T09:55:44.440 に答える