我为希腊本地报纸开发了一个动态网站,我在其移动版本(jquery mobile)上出现以下奇怪的行为:
我在每个页面顶部都有一个带有类别的选择(右上角),当我从那里选择任何类别时,我会捕获 onchange 事件并获取包含目标 url 的选项的值。页面发生更改,但立即返回到原始(调用者)页面。
我在页面内有一个 ListView ,其 URL 与顶部选择(类别)相同,如果我单击该链接(从 ListView 中),一切都会正常。
<强>3。此行为只能从任何 IPHONE SAFARI 浏览器中重现。
我读了一些或多或少有相同问题的答案,但任何解决方法都对我有用。手机版网址为:http://m.stagonnews.gr
谢谢。
最佳答案
不要使用$(document).ready()函数!
jQuery Mobile 文档提供了有关此内容的文档!每次您更改页面时它都会触发,并且因为弹出对话框不会记录到历史记录中,所以它可能会将您重定向到该页面。文档here
在您选择的字段上使用实时初始化,类似于:
//on all pages you have a div with data-role="header" | assign an id to it
//if this doesn't work, assign the live eventto your page id, not header id
$('#your_header_id').live('pageshow',function (event) { //or 'pagecreate'
//load function and fire the changing event when user changes the select
$('select[name=select-choice-a]').change(function(event){
//make sure it returns the exact value of select
//if not, there is a problem in your select value method
console.log('Change to page: #' + this.options[this.selectedIndex].value);
//to the change page method that changes the page
//you could also do the $.mobile.loadPage method to insert it into DOM before change
$.mobile.changePage('#' + this.options[this.selectedIndex].value,{changeHash: false})
})
});
我对在使用 jQuery Mobile 开发的移动应用程序中使用 anchor (#element_id's) 的看法是:不要!,但这只是我的看法! 我使用特定的 HTML 文件并指向它们的链接!为了将参数传递到另一个页面并检索它,我使用一个特定的函数来返回参数本身并用它做一些很酷的事情。我在另一个问题上发布了here该功能是什么以及如何使用它。然后我只需使用 $.mobile.changePage('myPage.html?id=' + variable) 更改页面。
我使用这种方法是因为我可以用有限的数据很好地构建我的应用程序,并且我可以使用一个 javascript 文件和 .live 事件来控制我的所有 html 文件。
简短的简介:
index.html <- load all javascripts/css/whatever here
other_file.html <- declare only <html><head></head><body> jQM specific div's here (like <div data-role"page"></div> etc,)</body></html>
关于JQuery Mobile 奇怪的行为,select 的 onchange 事件一直返回(仅在 SAFARI IPHONE 上),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/9109347/