標簽(空格分隔)： Android JQueryMobile

工程構建

新建一個Android工程

在工程中創建目錄assets/www

從官網(http://jquerymobile.com/)上下載JQuery和JQuery Mobile框架。

將query.mobile-x.x.x.min.css，query.mobile-x.x.x.min.js，images文件夾和query-xxx.min.js文件復制到assets/www目錄下。

在assets/www目錄下創建并編寫index.html文件

更改Activity類

示例代碼：index.html

JQuery Mobile Libraries

Page Title

Page content goes here.

Page Footer

示例代碼：MainActivity.java

package com.litsoft.jqmobile;

import android.app.Activity;

import android.os.Bundle;

import android.os.Handler;

import android.webkit.WebView;

/**

* 1.首先初始化WebView并允許WebView使用Javascript

* 2.使用handler機制，將MainActivity的對象實例和前端的Javascript綁定，交互的接口名稱為contactSupport

* @author Prostory

*

*/

public class MainActivity extends Activity {

WebView webView;

private Handler handler = null;

/** Called when the activity is first created. */

@Override

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

// 初始化WebView

webView = new WebView(this);

setContentView(webView);

// 允許使用Javascript

webView.getSettings().setJavaScriptEnabled(true);

handler = new Handler();

webView.addJavascriptInterface(this, "contactSupport");

//裝載index.html頁面

loadPage("index.html");

}

public void loadPage(String in){

final String url = "file:///android_asset/www/" + in;

loadURL(url);

}

private void loadURL(final String in){

handler.post(new Runnable(){

public void run(){

webView.loadUrl(in);

}

});

}

}

頁面設計說明：

在jQuery Mobile框架設計的HTML頁中，通常是一個頁面中有一個頁面容器，而頁面容器中則存在多個頁面。頁面容器以date-role=“page”作標識，而普通頁面以date-role=“content”作標識。在一個頁面中，頁面頭部和尾部是可選的部分。

示例代碼：

.....................

在上面的代碼中，展示了如何在一個容器頁面中包含三個頁面，其中有2個頁面是有頁頭和頁腳的，分別用data-role="header"和data-role="footer"標識。

總結

以上是生活随笔為你收集整理的jq调用android方法,Android端JQueryMobile使用教程(一)的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。