jQuery Mobile提供了哪些可配置选项？

您当前的位置：首页>最新动态>jQuery Mobile提供了哪些可配置选项？

新闻中心

最新动态缘震优势网建知识

精彩案例

地址：上海市静安区共和新路4718弄10号楼2楼

热线：400-166-3538

电话：13122077371

邮箱：sales@shyuanzhen.cn

jQuery Mobile提供了哪些可配置选项？

2013-02-01 00:00:00

上海缘震网络有限公司在前面的文章中我们上海网页设计就提到，jQuery Mobile是采用HTML5标准的data属性来驱动元素生成各种界面组件的。实际上，jQuery Mobile不仅提供上述这些方面的功能，还在JavaScript可编程方面提供更多的可配置、可定制的参数和方法。

同样，作为基于jQuery的jQuery Mobile移动框架，它也提供了一个类似的事件。当jQuery Mobile开始运行时，它会在document对象上触发一个mobileinit事件。我们可以通过该事件重写默认的相应函数，配置各种属性参数。

使用方法如下：

$(document).bind("mobileinit",function(){

//在这里添加用户自定义的代码

});

由于mobileinit事件在运行jQuery Mobile的时候会立即触发，因此如果我们需要编写自定义事件就必须在mobileinit事件之前进行。因此自定义事件的JavaScript文件的导入位置，就必须在jQuery类库文件之后，jQuery Mobile类库文件之前。

例如：

jQuery Mobile为开发者提供了一个对象：$.mobile。该对象的作用是配置各种选项及其默认值。

例如：

$(document).bind("mobileinit",function(){

$.mobile.foo = "foo";

});

除了上述通过$.mobile.foo 的点语法对某个属性值进行初始化以外，还可以使用jQuery自带的方法$.extend通过继承方式对属性值进行初始化。

$(document).bind("mobileinit",function(){

$.extend($.mobile,{

foo:"foo"

});

jQuery Mobile提供了非常多的可配置选项。

1.ns

类型：字符串，默认值是空字符串。

用法：$.mobile.ns = "mynamespace"

描述：自定义命名空间，避免命名空间冲突。使用方法是通过指定data-属性来自定义命名空间。当指定了ns值时，data属性所对应的自定义命名空间属性名就是data-mynamespace-foo。通常情况下，当开发者需要开发一套自定义主题样式时才需要使用该选项。

2.autolnitializePage

类型：布尔值，默认值是true。

用法：$.mobile.autoInitializePage = false

描述：默认情况下，当页面DOM元素准备就绪后，程序会自动加载autolnitializePage函数。如果autolnitializePage选项被设置为false，页面就不会被立即渲染，并保持隐藏状态，一直到人工调用$.mobile.initializePage 函数后才会渲染各种页面和视图组件。

initializePage函数是jQuery Mobile框架的内部初始化函数，该函数的主要功能是在DOM元素中查找和增强页面中的各个视图，并指定默认显示的第一个视图。

3.subPageUrlKey

类型：字符串，默认值是ui-page。

用法：$.mobile.autoInisubPageUrlKey = "page"

描述：该参数的主要功能是改变jQuery Mobile视图在URL地址中的key参数名，STRONG>上海网站设计举例：example.html?ui-page=subpage。当选项参数改成subPageUrlKey-"page"时，其url地址会被改为example.html?page=subpage。

当ui-page的值是一个URL地址时，jQuery Mobile框架会发送一个Ajax请求，并返回显示该URL页面。

4.activePageClass

类型：字符串，默认值是ui-page-active。

用法：$.mobile.activePageClass = "ui-ns-page-active"

描述：该选项参数参数的主要功能是自定义活动状态页面和过渡状态时的视图CSS样式。

5.activeBtnClass

类型：字符串，默认值是ui-btn-active。

用法：$.mobile.activeBtnClass = "ui-ns-page-active"

描述：该选项参数的主要功能是自定义处于活动状态的按钮的样式风格。

6.ajaxEnabled

类型：布尔值，默认值是true。

用法：$.mobile.ajaxEnabled = false

描述：该选项参数的作用是设置当单击链接或提交表单或按钮时，是否使用Ajax方式加载页面或提交数据。默认情况下，jQuery Mobile采用Ajax请求，而采用传统的HTTP方式请求跳转或提交方式。

7.hashListeningEnabled

类型：布尔值，默认值是true。

用法：$.mobile.hashListeningEnabled = false

描述：设置jQuery Mobile是否自动监听和处理location.hash的变化，如果设置为false,可以使用手动的方式处理hash的变化，或者简单的使用链接地址进行跳转。

8.defaultPageTransition

类型：布尔值，默认值是true。

用法：$.mobile.defaultPageTransition = "fade"

描述：该选项菜熟的作用是设置页面切换默认的效果。如果设置none，页面切换时将不会有效果。可选的切换效果包括：slide（左右划入）、slideup（由下向上滑入）、slidedown（由上向下滑入）、pop（由中心展开）、fade（渐显）、flip（翻转）。

9.touchOverflowEnabled

类型：布尔值，默认值是false。

用法：$.mobile.touchOverflowEnabled = true

描述：是否使用设备的原生区域滚动特性。目前除iOS5外，大部分设备还不支持原生的区域滚动特性。

10.defaultDialogTransition

类型：字符串，默认值是pop。

用法：$.mobile.defaultDialogTransition = "none"

描述：该选项设置Ajax对话框的弹出效果，若设置为none，则没有过渡效果。其可选的效果和defaultPageTransition属性相同。

11.minScrollBack

类型：字符串，默认值为150。

用法：$.mobile.minScrollBack = "200"

描述：当滚动超出所设置的高度时才会出发滚动位置记忆功能。当滚动高度没有超过所设置的高度时，后腿到该页面滚动条会到达的顶部。通过设置该选项的数值来减小位置记忆的数据量。

12.loadingMessage

类型：字符串，默认值是loading。

用法：$.mobile.loadingMessage = "加载中"

描述：设置页面加载状态的文本内容。如果设置为false，则不会显示任何内容。

13.pageLoadErrorMessage

类型：字符串，默认值是Error Loading Page。

用法：$.mobile.pageLoadErrorMessage = "页面加载失败"

描述：设置当Ajax请求页面失败时显示的提示文本内容。

14.gradeA

类型：布尔值，默认值是$.support.mediaquery的值。

用法：$.mobile.gradeA

描述：当浏览器复合所有支持的条件时才会返回true。默认返回$support.mediaquery的值。

上面介绍了jQuery Mobile 1.0bata3版本中提供个可配置参数选项，由于该版本仍然是一个beta版本,因此上海网页设计认为这类配置参数可能会随着后续版本的更新而发生变化，例如有可能在下一个版本中发现某些配置选项已经被抛弃或者会新增更多的配置选项等。

网站建设图片的高清素材去哪里找？

以下是一些可以找到网站建设高清素材图片的途径： 1. **免费素材网站**： - **Unsplash**：图片数量众多、清晰度高，题材丰富，包含各种风格和主题的图片，可免费商用，非常适合网站建设使用。比如可以找到适合作为网站背景的自然风景图、科技感的抽象图等。 - **Pexels**：不仅有大量高质量图片，还有丰富的视频素材。支持中文关键词搜索，方便用户快速找到所需素材，其图片可免费用于商业和非商业用途。 - **pixabay**：提供高清的矢量图和图片，图片背景透明，可直接用于网站设计，且支持多种文件格式下载。 - **别样网**：国内的免费图片网站，提供大量可商用图片，图片质量较高，能满足网站建设的多种需求。 - **pngimg**：专门提供PNG格式的免费素材，用户可以按照关键词搜索想要的素材，方便用于网站的图标、装饰元素等。 - **花瓣网**：国内大型的图片集合网站，用户可以通过搜索找到各种与网站建设相关的图片素材，并且能从其他用户的收藏和分享中获取灵感。 2. **付费素材网站**： - **千库网**：有大量的网站建设相关图片素材，包括背景图、图标、网页设计元素等，图片质量高且风格多样，部分素材需要付费购买会员后才能下载使用。 - **摄图网**：提供高清的图片素材，有多种授权方式可供选择，适合对图片版权要求较高的网站建设项目。 - **视觉中国**：拥有海量的专业图片资源，图片质量和版权都有较高的保障，但价格相对较高，适合大型商业网站建设或对图片质量有极高要求的项目。 3. **专业设计社区**： - **Dribbble**：汇聚了众多优秀的设计师，他们会在上面分享自己的设计作品，包括网站设计相关的图片素材。虽然有些作品可能受版权限制不能直接使用，但可以从中获取设计灵感和参考。 - **Behance**：是一个展示和发现创意作品的平台，有很多设计师会上传网站设计项目，其中包含高质量的图片素材，能为网站建设提供新颖的设计思路。 4. **搜索引擎的图片库**： - 例如百度图片、谷歌图片等，输入相关关键词可以搜索到大量的图片，但需要注意图片的版权问题，尽量选择来自正规网站或有明确授权信息的图片。对于谷歌图片，在国内使用可能需要借助一些技术手段。