jquery mobile开发常见问题分析


Posted in Javascript onJanuary 21, 2016

本文实例分析了jquery mobile开发常见问题。分享给大家供大家参考,具体如下:

jquery mobile功能很强大,有了它,不用在程序中,写方法去判断,是什么手机了,完全可以用js来实现各种智能手机的的兼容性。也是因为功能强大,jquery mobile插件,200多K,min也有140多K。

1、jquery mobile是通过ajax来进行页面请求,ajax大家都知道,是不涮新页面的。也就是说地址栏的变动也不是真实的涮新。这样就有问题了,js只有刷新页面的时候才会执行,起作用,页面中的js代码刷新页面起作用,点了页面里面的跳转,在转回来就不起作用了。

错误代码:

<script type="text/javascript">
$(function(){
  $('#search01').bind("click",function(){
    $('.searchPanel').show();
  });
});
</script>

正确代码:

<script type="text/javascript">
$(function(){
  $('#search01').live("click",function(){ //jquery 1.7系列
    $('.searchPanel').show();
  });
});
</script>

如果是jquery 1.9系列的

<script type="text/javascript">
$(document).on('click', '#search01', function () { //jquery 1.9系列
  $('.searchPanel').show();
});
</script>

2、所有页面都在一个页面里面,这个时候,就要注意了,id不要用一样的,不然只会读取第一个。多页面在一个页面里面,会出现很多问题。例如算标签到窗口顶部的距离,就会不准。

错误写法:

$('html,body').animate({
   scrollTop: $('.content').offset().top
}, 100);

这样写的问题是,当前页面,前面很可能有很多页面,这样top值就不对了,你如果刷新页面值就会正确

正确写法:

$('html,body').animate({
   scrollTop: $('.ui-page-active .content').offset().top
}, 100);

.ui-page-active,表示当前激活的页面,这样算出来的高度就是对的。

3、php变量赋值给JS变量,有的时候会起作用,有的时候不能。

color = '<?php echo $color?>';

对于这个问题,也没有找到是什么原因产生的。但是,可以用其他方法解决。
<input type="hidden" id='color' value='<?php echo $color;?>'>
<script type="text/javascript">
  color = $('.ui-page-active #color').val();
</script>

希望本文所述对大家jQuery程序设计有所帮助。

Javascript 相关文章推荐
jq选项卡鼠标延迟的插件实例
May 13 Javascript
JSON相关知识汇总
Jul 03 Javascript
跟我学习javascript的作用域与作用域链
Nov 19 Javascript
简单介绍JavaScript数据类型之隐式类型转换
Dec 28 Javascript
AngularJS表单详解及示例代码
Aug 17 Javascript
jQuery插件FusionCharts实现的Marimekko图效果示例【附demo源码】
Mar 24 jQuery
微信小程序-getUserInfo回调的实例详解
Oct 27 Javascript
Angular2管道Pipe及自定义管道格式数据用法实例分析
Nov 29 Javascript
Node.js应用设置安全的沙箱环境
Apr 23 Javascript
如何在微信小程序中实现Mixins方案
Jun 20 Javascript
原生JS实现记忆翻牌游戏
Jul 31 Javascript
JavaScript中常用的3种弹出提示框(alert、confirm、prompt)
Nov 10 Javascript
json格式数据的添加,删除及排序方法
Jan 21 #Javascript
jquery及js实现动态加载js文件的方法
Jan 21 #Javascript
js console.log打印对像与数组用法详解
Jan 21 #Javascript
JS遍历数组及打印数组实例分析
Jan 21 #Javascript
js采用concat和sort将N个数组拼接起来的方法
Jan 21 #Javascript
如何用angularjs制作一个完整的表格
Jan 21 #Javascript
angularjs自定义ng-model标签的属性
Jan 21 #Javascript
You might like
收藏的PHP常用函数 推荐收藏保存
2010/02/21 PHP
基于PHP静态类的原罪详解
2013/05/06 PHP
php类常量用法实例分析
2015/07/09 PHP
PHP如何获取当前主机、域名、网址、路径、端口等参数
2017/06/09 PHP
php pdo连接数据库操作示例
2019/11/18 PHP
关于js拖拽上传 [一个拖拽上传修改头像的流程]
2011/07/13 Javascript
js 实现css风格选择器(压缩后2KB)
2012/01/12 Javascript
JavaScript中的this关键字介绍与使用实例
2013/06/21 Javascript
js history对象简单实现返回和前进
2013/10/30 Javascript
JavaScript淡入淡出渐变简单实例
2015/08/06 Javascript
JQuery中attr属性和jQuery.data()学习笔记【必看】
2016/05/18 Javascript
深入理解jQuery之防止冒泡事件
2016/05/24 Javascript
jQuery条件分页 代替离线查询(附代码)
2017/08/17 jQuery
React Native 通告消息竖向轮播组件的封装
2020/08/25 Javascript
前后端常见的几种鉴权方式(小结)
2019/08/04 Javascript
详解webpack-dev-middleware 源码解读
2020/03/23 Javascript
vue移动端弹起蒙层滑动禁止底部滑动操作
2020/07/22 Javascript
vue-cli脚手架的.babelrc文件用法说明
2020/09/11 Javascript
使用Python的Django框架结合jQuery实现AJAX购物车页面
2016/04/11 Python
Python编程实现线性回归和批量梯度下降法代码实例
2018/01/04 Python
python交互模式下输入换行/输入多行命令的方法
2019/07/02 Python
Django中reverse反转并且传递参数的方法
2019/08/06 Python
对django 2.x版本中models.ForeignKey()外键说明介绍
2020/03/30 Python
基于Python实现2种反转链表方法代码实例
2020/07/06 Python
一个非常简单好用的Python图形界面库(PysimpleGUI)
2020/12/28 Python
Python 实现劳拉游戏的实例代码(四连环、重力四子棋)
2021/03/03 Python
HTML5和以前HTML4的区别整理
2013/10/20 HTML / CSS
集团公司人力资源部岗位职责
2014/01/03 职场文书
优秀学生干部推荐材料
2014/02/03 职场文书
平安建设汇报材料
2014/12/29 职场文书
送达通知书
2015/04/25 职场文书
演讲开场白和结束语
2015/05/29 职场文书
大学生党课感想
2015/08/11 职场文书
深度学习tensorflow基础mnist
2021/04/14 Python
python中的被动信息搜集
2021/04/29 Python
python数字转对应中文的方法总结
2021/08/02 Python