2017-04-21 1 views
0

닫기 버튼을 하나 개의 함수닫기 버튼을

에 jQuery를 작동하지 않는 하나 개의 기능에 jQuery를 작동하지 않습니다 나는 JQuery와에서 수행 다음 모달, 나는 닫기 버튼을 클릭의 문제를 해결하기 위해 여러 가지 방법을 시도해야, 그러나 나는 그것을 작동시킬 수 없다.

의견이나 제안이 있으십니까?

LINK : http://jsfiddle.net/wx0wvh9L/

JQUERY :

(function($) { 
    $.fn.modalBox = function($custom) { 
    var name = "box-modal", 
     custom = ($custom == null) ? "" : $custom; 

    $(this).on('click', function(e) { 
     e.preventDefault(); 
     var link = $(this).data("modal"), 
     iframe = '<div class="' + name + ' ' + custom + '">' + 
     '<iframe src="' + link + '" frameborder="0" allowfullscreen></iframe>' + 
     '<div class="close"></div>' + 
     '</div>'; 
     $("body").append(iframe); 
     $("." + name).fadeIn(350); 
    }); 

    $(".close").on('click', function(e) { 
     e.preventDefault(); 
     $("." + name).hide(); 
    }); 
    }; 
}(jQuery)); 

$(".modal-video").modalBox(); 

HTML :

<div class="modal-video" data-modal="https://www.youtube.com/embed/P2x3-b6JEj8?rel=0&amp;showinfo=0&amp;autoplay=1"> 
    Test Click 
</div> 

답변

0

대신

$("body").on('click','.box-modal .close', function(event){ 
    event.preventDefault(); 
    $("." + name).hide(); 
}); 
시도

당신이 정의한 문제는 $('.close')이 존재하지 않는다는 것입니다. 클릭 한 후에 만 ​​"존재"합니다. 대안으로 onclick 메서드 안에 넣을 수도 있습니다. 이것은 내가 말했듯이

은 또한 너무

$(this).on('click', function(e) { 
     e.preventDefault(); 
     var link = $(this).data("modal"), 
     iframe = '<div class="' + name + ' ' + custom + '">' + 
     '<iframe src="' + link + '" frameborder="0" allowfullscreen></iframe>' + 
     '<div class="close"></div>' + 
     '</div>'; 
     $("body").append(iframe); 
     $("." + name).fadeIn(350); 
     $(".close").on('click', function(e) { 
     e.preventDefault(); 
     $("." + name).hide(); 
     }); 
    }); 
처럼 온 클릭 방식의 내부에 넣을 수 있습니다 ... 자바 스크립트의 범위에 기인한다