今天测试jQuery Mobile的主题功能时，动态改变它的theme，出现总是没有更新主题效果。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0,user-scalable=no" />
<link rel="stylesheet" href="css/jquery.mobile-1.3.0-beta.1.min.css" />
<script type="text/javascript" src="js/fastclick.js"></script>
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript" src="js/jquery.cookie.js"></script>
<script type="text/javascript" src="js/jquery.mobile-1.3.0-beta.1.min.js"></script>
<script type="text/javascript">
$(function(){
var selTheme = $("#selTheme");
selTheme.bind("change",function(){
if(selTheme.val()!=""){
$.cookie("StrTheme",selTheme.val(),{
path:"/weixin",
expires:1
})
window.location.reload();
}
});
});
/*
该段代码放在ready里面，则只有第一次生效，因为放在ready里面就意味着要等DOM加载完成在执行，
此时页面已经加载了一种主题，再执行该段代码更换另一宗主题，但是没有刷新，所以页面在显示上就没有变化过来
*/
if($.cookie("StrTheme")){
alert($.cookie("StrTheme"));
$.mobile.page.prototype.options.headerTheme = $.cookie("StrTheme");
}
</script>
<base>
<title>jqueryMobile_3</title>
</head>
<body>
<!-- 页面一 -->
<div data-role="page" id="page1">
<div data-role="header">
<h1>雾烨</h1>
<div data-role="navbar">
<ul>
<!-- 添加样式， class="ui-btn-active" 表示该按钮是活动的 -->
<li><a href="index.html" data-iconpos="top" data-icon="search">Search</a></li>
<li><a href="index.html" data-iconpos="top" data-icon="home">Home</a></li>
<li><a href="jqueryMobile_4.html" data-iconpos="top" data-icon="info">More</a></li>
</ul>
</div>
</div>
<div data-role="content">
<select id="selTheme" data-native-menu="false">
<option value="">选择主题</option>
<option value="a">主题a</option>
<option value="b">主题b</option>
<option value="c">主题c</option>
<option value="d">主题d</option>
<option value="e">主题e</option>
</select>
</div>
<div data-role="footer">
<h2>©2015 ripin.com test</h2>
</div>
</div>
</body>
</html>
将该段代码
if($.cookie("StrTheme")){
alert($.cookie("StrTheme"));
$.mobile.page.prototype.options.headerTheme = $.cookie("StrTheme");
}
放到ready()外，问题解决，此刻才深刻理解到先加载完DOM再 执行ready中的函数的意思。这里的主题无效也是因为已经加载完dom内容，页面显示已经完成，此时主题设置了，但是没有刷新，所以页面显示上也就无效。
相关推荐
JQuery的ready函数与JS的onload的区别：1.执行时间[removed]必须等到页面内包括图片的所有元素加载完毕后才能执行。$(document).ready()是DOM结构绘制完毕后就执行，不必等到加载完毕。 2.编写个数不同[removed]不能...
然后在页面中也需要用到$().ready函数，这下好了： 虽然jQuery本身的设计还算不错，document加载完成后会依次触发各个ready中定义的function(这一点很好，不象javascript中默认后面的同名函数会覆盖前面的函数定义)...
在JavaScript中，onload函数是最经常使用的，几乎涉及到JavaScript的童鞋都少不了要接触它。这个函数的作用就是等待网页完全装载完了以后再去执行代码块内的语句，因为按照文档流的执行顺序，通常用于头部加载...
vue钩子函数很多，不过这些钩子函数都是在vue本身的生命周期有关，却没有一个走的是项目过程。vue-ready就是为了让项目过程更简单。
一、ready函数的实现经常用jQuery类库或其他类库中的ready方法，有时候想想它们到底是怎么实现的，但是看了一下jQuery中的源码，涉及到的模块比较多，(水平有限)代码比较难看懂；自己结合了一些书籍内容，总结一下。...
因为它接收的方法在页面中所有的 DOM 都可访问时才执行, 所以此时你完全可以访问和操作 html 中的元素. 在 jQuery 3.0 之前, 典型的匿名函数方式的用法如下: $(document).ready(function() { // 在 .ready() 被...
// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。...
vue.js 教程 ...我期望vue中tds全都渲染在界面上之后，再调用一个函数（其实这个函数主要作用是给表格中的选择框加监听，如果tds没有渲染，那监听也加不上去）。 <table class=table table-border
Promises 提供了 callback-passing 的替代方案，异步函数返回一个 Promise 对象可附加到 callbacks 中。 示例代码： function asyncfoo() { var p = new promise.Promise(); /* (1) create a Promise */ ...
答案是先执行.ready()之前的javascript代码，然后执行.ready()。 多个$(document).ready()的执行顺序并非单纯的顺序执行，其与嵌套层级也有一定的关系。 ——————–js加载执行顺序———————– 1.加载顺序：...
代码如下: [removed][removed] [removed] $(“#CheckoutStepShippingProvider”).ready(function(){ if($(“#Note_52413376ea55e_1″).text()==”US$29.99”){ $(“#XX_2”).css(“display”,”block”); }else{ $...
JQ中的$(document).ready()大家应该用的非常多，基本每个JS脚本中都有这个函数的出现有时甚至会出现多个，那么另一个加载函数$(window).load相对出现的次数就很少了，下面为大家介绍一下两者的区别与他们的执行顺序 ...
})这个函数是用来取代页面中的[removed]; document.ready()和传统的方法<body onload=”load()”> 相似，不同的是onload()的方法是在页面加载完成后才发生，这包括DOM元素和其他页面元素（例如图片）的加载，...
新手接触javascript、jquery的时候不可避免的要接触题目所标识的相关内容，反复看过几次一到用的时候总是不踏实，写此文以记之。 符号“$”是jquery对象... 上面是jquery中的东西，接着说下原生javascript中的，有
我们使用[removed] = function(){ … }，是希望在页面被载入时执行function中的处理，但是这些JS代码只有在页面上的全部内容加载完成（包括头部的banner广告，所有图片）的时候才会执行。将[removed]放在最上边的...
jQuery(document).ready(function(){}); 使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧，就是它了)的操作. 比如jquery写法：$(“div p”); // (1)$(“div.container”); // ...
步骤一：引入JS文件 步骤二：通过config接口注入权限验证配置 步骤三：通过ready接口处理成功验证 步骤四：通过error接口处理失败验证 接口调用说明 所有接口通过wx对象(也可使用jWeixin对象)来调用，参数是一个对象...
学习 jQuery 有许多途径，我们今天从 jQuery 的 ready 函数开始。本例中的代码都来自于 jQuery 脚本库。 如果你使用过 jQuery , 就必然使用过 ready 函数，它用来注册当页面准备好之后可以执行的函数。 问题来啦，...
我最近看到很多javascript代码,看起来我错了.在这种情况下,我应该建议哪种更好的...另外,由于它们在外部函数中没有做任何事情,所以嵌套的自调用函数可以刚刚嵌入到外部功能定义. 其实我不知道他们打算使用自调用函数,因