weixin_33709609 2014-09-16 23:44 采纳率: 0%
浏览 22

jQuery调用函数

I have am having an issue with my modal window structure. I have a div that calls a function when it is clicked to show a modal window. Inside of the showModal() function, I call another function that acts as the close function if the user clicks ESC key or out of the modal window anywhere in the document.

Here is the code:

$('body').on('click', '.container', function(){
    showModal();
});

On click, this opens up showModal

function showModal(_this) {
  $('body').addClass('video-open');
  $('.popup').load(templateDir + '/views/video.html', function() {
   $(this).show();
   $('.cloaked').show();
 });
 closeModal('.modal-window');
}

closeModal gets called immediately in the showModal. For some reason emptyModal gets fired immediately as well when my intention is to only fire it when the user clicks ESC or out of the modal.

function closeModal(selector) {
 $(document).keyup(function(e){
  if (e.keyCode == 27) {
   emptyModal(selector); 
  } 
});

$(document).click(function(e) {
 if (!$(e.target).closest(selector).length) {
   emptyModal(selector);      
  }
 });  
}

Using console.log I can see that 'window closed' and confirm that emptyModal is getting called immediately when closeModal is even though it is wrapped in conditional statements.

function emptyModal(selector) {
 console.log('window closed')
 $(selector).empty().hide();   
 $('.cloaked').hide();
}

I think overall I have a misunderstanding of how to do what I need and I am probably implementing it wrong. Just a side note, I have closeModal and emptyModal as separate functions as I use them in different modal view functions other than the showModal one.

  • 写回答

1条回答 默认 最新

  • weixin_33743661 2014-09-16 23:55
    关注

    In your closeModal function , instead of putting a click event on the whole document try putting it on .cloaked

    $('.cloaked').click(function(e) {
     if (!$(e.target).closest(selector).length) {
       emptyModal(selector);      
      }
     }); 
    

    If I understand correctly , the element with the .cloaked class is supposed to show a black cloak in the background when the modal dialog opens up, so clicking any where other than the modal dialog would mean that the user is clicking on the element with the .cloaked class.

    评论

报告相同问题?

悬赏问题

  • ¥15 三菱变频器模块怎么检测触发
  • ¥30 求一下解题思路,完全不懂。
  • ¥30 关于#硬件工程#的问题:求一下解题思路
  • ¥15 运筹学对偶单纯行法构造扩充问题
  • ¥20 XP系统的老电脑一开机就提示找不到rundll.exe,付费求解
  • ¥15 milvus查询出来的score怎么转换成0-1之间的相似性
  • ¥15 lvgl V9移植到linux开发板
  • ¥15 VB.net中在窗体中创建一个button控件来关闭窗体,但是提示错误,我该怎么办
  • ¥15 网上下载好的程序但是arduinoIDE编程报错,运行不了,哪里出错了,能具体给改一下吗
  • ¥15 Sharepoint JS开发 付费技术指导