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 相关文章推荐
prototype 的说明 js类
Sep 07 Javascript
js 发个判断字符串是否为符合标准的函数
Apr 27 Javascript
一步一步制作jquery插件Tabs实现过程
Jul 06 Javascript
js判断FCKeditor内容是否为空的两种形式
May 14 Javascript
jquery基础知识第一讲之认识jquery
Mar 17 Javascript
jquery 点击元素后,滚动条滚动至该元素位置的方法
Aug 05 Javascript
JS控制静态页面之间传递参数获取参数并应用的简单实例
Aug 10 Javascript
Vue2.5通过json文件读取数据的方法
Feb 27 Javascript
webpack热模块替换(HMR)/热更新的方法
Apr 05 Javascript
微信小程序 wx.getUserInfo引导用户授权问题实例分析
Mar 09 Javascript
JS函数本身的作用域实例分析
Mar 16 Javascript
JS中间件设计模式的深入探讨与实例分析
Apr 11 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
Eclipse中php插件安装及Xdebug配置的使用详解
2013/04/25 PHP
PHP用正则匹配form表单中所有元素的类型和属性值实例代码
2017/02/28 PHP
完美解决Thinkphp3.2中插入相同数据的问题
2017/08/01 PHP
从盛大通行证上摘下来的身份证验证js代码
2011/01/11 Javascript
js 对小数加法精度处理示例说明
2013/12/27 Javascript
基于javascript的COOkie的操作实现只能点一次
2014/12/26 Javascript
JavaScript中document.forms[0]与getElementByName区别
2015/01/21 Javascript
Javascript中的匿名函数与封装介绍
2015/03/15 Javascript
ajax如何实现页面局部跳转与结果返回
2015/08/24 Javascript
JS DOM实现鼠标滑动图片效果
2020/09/17 Javascript
JavaScript入门系列之知识点总结
2016/03/24 Javascript
jquery跟随屏幕滚动效果的实现代码
2016/04/13 Javascript
Struts2+jquery.form.js实现图片与文件上传的方法
2016/05/05 Javascript
瀑布流的实现方式(原生js+jquery+css3)
2020/06/28 Javascript
jQuery编写网页版2048小游戏
2017/01/06 Javascript
bootstrap日期插件daterangepicker使用详解
2017/10/19 Javascript
JavaScript根据json生成html表格的示例代码
2018/10/24 Javascript
trackingjs+websocket+百度人脸识别API实现人脸签到
2018/11/26 Javascript
使用jquery-easyui的布局layout写后台管理页面的代码详解
2019/06/19 jQuery
vue实现滑动到底部加载更多效果
2020/10/27 Javascript
js中console在一行内打印字符串和对象的方法
2019/09/10 Javascript
使用python3+xlrd解析Excel的实例
2018/05/04 Python
TensorFlow实现简单卷积神经网络
2018/05/24 Python
python2 中 unicode 和 str 之间的转换及与python3 str 的区别
2019/07/25 Python
django 模型中的计算字段实例
2020/05/19 Python
python中前缀运算符 *和 **的用法示例详解
2020/05/28 Python
基于Python采集爬取微信公众号历史数据
2020/11/27 Python
Python的Tqdm模块实现进度条配置
2021/02/24 Python
纯css3实现走马灯效果
2014/12/26 HTML / CSS
英国最大的女性服装零售商:Dorothy Perkins
2017/03/30 全球购物
加拿大时装零售商:Influence U
2018/12/22 全球购物
一份Java笔试题
2012/02/21 面试题
优秀团员事迹材料2000字
2014/08/20 职场文书
护士实习自荐信
2015/03/06 职场文书
Tensorflow与RNN、双向LSTM等的踩坑记录及解决
2021/05/31 Python
vue打包时去掉所有的console.log
2022/04/10 Vue.js