jQuery Mobile 站点中所有页面通用的弹出窗口 [英] Popups common to all pages in jQuery Mobile site

问题描述

我正在尝试使用 jQuery Mobile 制作网站.它由 HTML 文件中的许多页面组成，其中一些只有一页，而另一些有几页(使用它们的 多页功能).

I am trying to make a site using jQuery Mobile. It consists of many pages in HTML files, some of which have only one page, and some of which have several pages (using their multi-page feature).

该网站将有一些通知弹出窗口，它们在所有页面上看起来都一样.我正在使用他们的新的弹出功能 似乎是为此目的而设计的.我可以通过在每个页面上放置弹出窗口的副本来轻松实现这一点，但这会创建大量可能难以维护的冗余代码.我可能可以让我的服务器在适当的位置为我插入代码，但这似乎很复杂且效率低下.

The site is going to have some popups for notifications, and they are going to look the same on all pages. I am implementing the popups using their new popup feature which seems designed for this purpose. I can easily implement this by putting copies of the popups on each of the pages but this will create a lot of redundant code which may be hard to maintain. I can probably make my server insert the code for me in the proper places but that seems complex and inefficient.

我尝试将弹出窗口放在页面之外，但它们不能可靠地工作(您可以在 此处查看示例).

I tried putting the popups outside of the pages and they do not work reliably (you can see an example here).

我尝试使用模板系统(underscore.js 中内置的)动态生成它们，但这看起来可能会导致问题 - 我将不得不在关闭时销毁每个弹出窗口以避免内存泄漏.

I tried dynamically generating them by using a templating system (the one built into underscore.js) but that looks like it may cause problems – I will have to destroy every popup when it is closed to avoid memory leaks.

我不确定这是否是弹出窗口小部件中的错误，这似乎很可能，因为弹出窗口小部件仅在 jQuery Mobile 的 alpha 版本中.

I am not sure if this is a bug in the popup widget, which seems likely since the popup widget is only in an alpha version of jQuery Mobile.

这里有没有人知道如何在多个 html 文件中创建一个包含多个页面的网站，以及所有页面共有的一些弹出窗口?

Does anyone here have any ideas as to how to make a site with many pages in several html files, with a few popups that are common to all of the pages?

推荐答案

我已经在 jQuery Mobile github 上看到了您的请求，并发布了我在我的 Web 应用程序中使用的解决方案.检查 http://ghita.org/jquery/dynamic-mobile-popup 这是一个小允许您拥有动态弹出窗口的插件，它让您专注于弹出窗口的内容和事件.

I've seen your request on jQuery Mobile github, and posted a solution that I'm using on my web applications. Check http://ghita.org/jquery/dynamic-mobile-popup it's a small plugin that allows you to have dynamic popups, it let you focus on the content of the popup and the events.

包含插件(有1.8kb)，然后调用:

Include the plugin (has 1.8kb), and then call:

$.dynamicPopup({content: 'This is the dynamic content of the popup.'});

content - 可以是字符串或 jQuery html 对象.

content - can be a string or a jQuery html object.

检查 https://github.com/serbanghita/jQM-dynamic-popup对于完整的选项列表，其中一些是从 jQuery 的移动 popup() 函数继承的.

Check https://github.com/serbanghita/jQM-dynamic-popup for the full list of options, some of which are inherited from jQuery's mobile popup() function.

这个问题对我来说是个障碍，因为我有动态网页，而且我不关心手动注入 HTML 内容以使 popup() 处于活动状态.希望对您有所帮助.

This problem was a show stopper for me because I have dynamic webpages and I don't care of manually injecting HTML content for the popup() to be active. Hope you find it helpful.

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