2017-02-14 15 views
1

ユーザがクリックした場合<li><a id="print" href="">출력 하기</a></li> id = "print2"というid = "print2"ボタンを作成するのでタイトルはコピーします。チェックボックスを作成します。2番目のjs関数が機能しない

をクリックし、ユーザーがid = "print2"ボタンを "コピーする"をクリックすると、 は機能しません。反応はありません。

何が恋しいですか?

$(document).ready(function(){ 
     $("#print").unbind('click'); 
     $("#print").on('click', function(ev){ 
      $('#main').prepend('<center><button class="btn btn-primary btn-lg" id="print2">복사하기</button></center>') 
      $('.post').prepend('<input type="checkbox" />'); 
      ev.preventDefault(); 
     }); 


    $("#print2").on('click', function(){ 
     var images =''; 
     $('li').each(function(){ 
      var thisCheckFlag=$(this).children('input[type="checkbox"]').is(':checked'); 
      if(thisCheckFlag){ 
       images+='<img src ="'+$(this).find('img').attr('src')+'">'; 
      } 
     }); 
     if(images){ 
      var myWindow=window.open('','printWindow','width=800,height=800'); 
      myWindow.document.write(
       '<html><head><title>Print</title></head><body>' 
       +images+'</body></html>' 
      ); 
      myWindow.focus(); 
      myWindow.print(); 
     } 
     else alert('먼저 선택하세요.'); 
    }); 


    }); 
+0

可能な重複:あなたはそれに関連したeventを追加する必要が新しいボタンを追加しますので、何でも
(http://stackoverflow.com/questions/203198/event-binding-on-dynamically-created-elements) – juvian

答えて

0

ここでの問題は、イベントが動的に作成された要素を結合していないということです、 DYNAに結合[イベントの

$(document).ready(function() { 
    $("#print").unbind('click'); 
    $("#print").on('click', function(ev) { 
     $('#main').prepend('<center><button class="btn btn-primary btn-lg" id="print2">복사하기</button></center>') 
     $('.post').prepend('<input type="checkbox" />'); 
     $("#print2").on('click', function() { 
      var images = ''; 
      $('li').each(function() { 
       var thisCheckFlag = $(this).children('input[type="checkbox"]').is(':checked'); 
       if (thisCheckFlag) { 
        images += '<img src ="' + $(this).find('img').attr('src') + '">'; 
       } 
      }); 
      if (images) { 
       var myWindow = window.open('', 'printWindow', 'width=800,height=800'); 
       myWindow.document.write(
        '<html><head><title>Print</title></head><body>' + images + '</body></html>' 
       ); 
       myWindow.focus(); 
       myWindow.print(); 
      } else alert('먼저 선택하세요.'); 
     }); 
     ev.preventDefault(); 
    }); 


}); 
+0

ありがとう、それは非常に詳細なアドバイスです。良い一日を!! –

1

#print2は、クリックすると定義されません。 あなたがSee more

...通常document、親にクリックを委任する必要があるので、あなたの関数はなります:

$(document).on('click', '#print2', function(){ 
    //rest of code. 
}); 
+0

ありがとう、それは非常に有用です!! –

関連する問題