使用Rails加载页面时的jQuery Mobile弹出窗口 [英] jQuery Mobile popup on page load with Rails

问题描述

我正在尝试使用jQuery Mobile和Rails在页面加载时打开一个弹出窗口.

I am trying to open a popup on page load using jQuery Mobile and Rails.

可以通过链接打开弹出窗口，但是我无法使其在加载时打开.

The popup can be opened with a link, but I can't make it open on load.

HTML代码

<div data-role="popup" id="popup-choix" data-history="false" data-overlay-theme="a" data-transition="flow" data-position-to="window">
    <ul>...</ul>
</div>

JavaScript代码

Javascript code

$(document).on("pageshow", function() {
  $('#popup-choix').popup('open'); 
});

我用Chrome浏览器检查过，并且Javascript已正确链接到页面.

I checked with Chrome and the Javascript is correctly linked to the page.

我在页面上有一个打开弹出窗口的链接.效果很好.

I have a link on the page to open the popup. It works perfectly.

<div class="div-popup"><a href="#popup-choix" data-rel="popup">...</a></div>

我想问题出在我的Javascript上...

I guess the problem is with my Javascript then...

更新

我将Javascript放置在popup.js中，然后使用application.js清单进行调用.

I placed the Javascript in popup.js, which is then called with the application.js manifest.

更新2

我在 popup.js中编写了javascript 并使用清单进行调用.

I wrote the javascript in popup.js and call it with the manifest.

推荐答案

已更新

注意:面向 Ruby on Rails 用户的这是在页面加载/显示后打开弹出窗口的正确方法.

This is the correct way to open a popup, once page loads/shows.

$(document).on("pageshow", function() {
 $('#popup-choix').popup('open');
});

在某些浏览器中，页面加载后不显示弹出窗口，因此，添加超时来打开弹出窗口是必不可少的.

In some browsers, popup doesn't show once the page loads, therefore, adding timeout to open the popup is essential.

来源

$(document).on("pageshow", function() {
 setTimeout(function () {
    $('#popup-choix').popup('open');
 }, 100); // delay above zero
});

如果要打开特定页面，请添加'#PageId'而不是document.

If you want to open for a specific page, add '#PageId' instead of document.

这篇关于使用Rails加载页面时的jQuery Mobile弹出窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！