Question

我试图设置一个带有模态窗口的页面，该窗口会触发存在于窗口中的鼠标或点击链接。

使用Ouibounce在退出时即可点火： http://carlsednaoui.github.io/ouibounce/

关于Ouibounce API的文档表明我也应该能够通过点击来启动模式。

我已经更改了上面示例中的链接，给它一个#modal_button的id，但是我无法触发该窗口：

  // if you want to use the 'fire' or 'disable' fn,
  // you need to save OuiBounce to an object
  var _ouibounce = ouibounce(document.getElementById('ouibounce-modal'), {
    aggressive: true,
    timer: 0,
    callback: function() { console.log('ouibounce fired!'); }
  });


  $('#modal_button').on('click', function() {
    $('#ouibounce-modal').fire();
  });



  $('body').on('click', function() {
    $('#ouibounce-modal').hide();
  });


  $('#ouibounce-modal .modal-footer').on('click', function() {
    $('#ouibounce-modal').hide();
  });

  $('#ouibounce-modal .modal').on('click', function(e) {
    e.stopPropagation();
  });

我在这里设置了一个jsfiddle也做了同样的事情。 http://jsfiddle.net/fr7k3s6f/

（出于某种原因，＆＃39;隐藏＆＃34;在身体事件上并没有在jsfiddle中工作）

Answer 1

您需要使用对象_ouibounce来调用fire（）函数：

_ouibounce.fire();

而不是jQuery对象。如果你在jQuery.ready（）中定义它，它需要是一个全局对象，所以没有＆＃34; var＆＃34;之前。但我认为这是当前版本中的一个错误（0.0.10）。

我希望这会有所帮助。

单击时无法触发ouibounce.js模式

1 个答案: