jquery - 为什么我必须刷新每个页面才能让 jQuery 在每个页面上正常工作？

Question

我正在使用 jQuery Mobile，我正在尝试将一个简单的列表项从一个页面移动到另一个页面。这是我正在使用的一段代码：

$('#YesNoMaybePage, #summaryPage').live('pageinit', function() {
$('.green, .blue, .red').click(function(){
    var $move = $('.purchase').prependTo("#summaryPage .theListItem");
});
});

现在这很好用，当我刷新时#summaryPage，单击返回#YesNoMaybePage并执行事件。#YesNoMaybePage但是，如果我刷新并执行它，它就不起作用。#summaryPage我假设刷新时没有加载html ，#YesNoMaybePage这就是它不起作用的原因，但老实说我不知道​​。任何想法为什么会这样以及我如何解决这个问题？

感谢一堆世界。我爱你。为了进一步澄清，这里是另一个代码片段，我有完全相同的问题：

$('#YesNoMaybePage, #categorizePage').live('pageinit', function() {
$('.green, .blue, .red').click(function(){
    var $move = $('.purchase').prependTo("#categorizePage .theListItem");
});
});

Answer 1

这两个“页面”是否同时在 dom 中？您似乎正在尝试将 html 元素添加到当前未显示的页面。那不会飞，你只能修改当前加载的dom。

Answer 2

这可能是因为您的 javascript 包含在您的 summarypage.html 中，而不是您的 yesnomaybepage.html 中。这是 jqm 的预期行为。您必须在站点的每个页面中包含相同的 js，或者将所有页面打包到一个 html 文件中。 http://jquerymobile.com/demos/1.2.0/docs/pages/multipage-template.html

Answer 3

我以前也有同样的问题。我的问题是turbolink。通过禁用它，它对我来说非常有用。这是一个非常简单的删除方法：转到app/assets/javascripts/application.js

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
//= require turbolinks
//= require_tree .

去掉turbolink前面的等号就行了

//= require jquery
//= require jquery_ujs
//= require twitter/bootstrap
// require turbolinks
//= require_tree .

就是这样