jquery cluetip 플러그인을 사용하고 있고 ajax를 통해 새 내용을로드하면 열려있는 cluetip 대화 상자를 제거하는 방법을 알아 내려고합니다. 나도 여전히 새로운 콘텐츠 위에 표시되는 대화 상자로 붙어 있거나이 문제를 해결하기 위해 노력한 방법으로 실제로 향후 모든 cluetip 대화 상자가 전혀 표시되지 않도록 제거합니다.Jquery Cluetip - Ajax 로딩 된 내용 간 정리
다음은 내 코드입니다. 도움을 주셔서 감사합니다.
DOM 준비에서 다음과 같이 cluetip을 인스턴스화합니다.
//activate cluetip
$('a.jTip').cluetip({
attribute: 'href',
cluetipClass: 'jtip',
arrows: true,
activation: 'click',
ajaxCache: false,
dropShadow: true,
sticky: true,
mouseOutClose: false,
closePosition: 'title'
});
새 콘텐츠를로드 할 때 다음 코드가 있습니다. 내가 가진 문제는 $ ('. cluetip-jtip'). empty()는로드 된 새 내용 중 하나라도 대화 상자를 열지 못하게하는 반면 destroy 함수는 열려있는 대화 상자를 제거하지 않고 현재 개체.
$('.next a').live("click", function(){
var toLoad = $(this).attr('href');
var $data = $('#main_body #content');
$.validationEngine.closePrompt('body'); //close any validation messages
$data.fadeOut('fast', function(){
$data.load(toLoad, function(){
$data.animate({
opacity: 'show'
}, 'fast');
//reinitialise datepicker and toolip
$(".date").date_input();
//JT_init();
$('.hidden').hide();
//scroll to top of form
$("html,body").animate({
"scrollTop": $('#content').offset().top + "px"
});
//remove existing instance
//$('a.jTip').cluetip('destroy');
//remove any opened popups
$('.cluetip-jtip').empty();
//reinitialise cluetip
$('a.jTip').cluetip({
attribute: 'href',
cluetipClass: 'jtip',
arrows: true,
activation: 'click',
ajaxCache: false,
dropShadow: true,
sticky: true,
mouseOutClose: false,
closePosition: 'title'
});
});
});
return false;
});
감사합니다. 나는 여러 인스턴스를 피하기 위해 destroy() 라인도 유지했다. – ted776