1. 程式人生 > >js呼叫移動端原生方法

js呼叫移動端原生方法

問題描述:

移動端使用webview開啟網頁,網頁中需要用js呼叫移動端原生的方法來實現另外的一些功能。

解決方法:

首先,需要判斷是android端還是ios端

//判斷是否為ios端訪問
function _IsIOS() {
    if (/(iPhone|iPad|iPod|iOS)/i.test(navigator.userAgent)) {
        return true;
    } else {
        return false;
    }
}
//判斷是否為android端訪問
function _IsAndroid() {
    if (/(Android|Adr)/i
.test(navigator.userAgent)) { return true; } else { return false; } }

然後根據判斷結果來呼叫移動端的原生方法

//method為移動端原生方法的方法名,param為要傳遞的引數
if (_IsIOS()) {
    window.webkit.messageHandlers.method.postMessage(param);
} else if (_IsAndroid()) {
    window.control.call('method', param);
    //或者window.control.method(param);
}

注意:

  1. ios只接受一個引數,因此如果需要傳遞多個引數,可以將引數做成json進行傳遞
  2. ios的引數不能不傳,哪怕只傳個空字串(這是個坑)

相關推薦

js呼叫移動原生方法

問題描述: 移動端使用webview開啟網頁,網頁中需要用js呼叫移動端原生的方法來實現另外的一些功能。 解決方法: 首先,需要判斷是android端還是ios端 //判斷是否為ios端訪問

JS實現移動下拉刷新更多分頁請求功能方法2.0

keyframes 發生 usb 第一次 odr back eight urn 返回頂部 本次2.0升級版為js實現移動端加載更多下拉刷新更多分頁請求功能方法(數據一次請求,前端分頁,適用於數據流量較少,數據量壓力小的頁面)同時新增loading組件,turnToTop組件

js判斷移動是否安裝某款app的多種方法

lose wap androi var 運行 ipad http tee creat 第一種方法: 一:判斷是那種設備 var isAndroid = u.indexOf(‘Android‘) > -1 || u.indexOf(‘Linux‘) > -1; /

網頁js識別移動幾種方法

方法一 <script type="text/javascript"> var browser={ versions:function(){ var u = navigator.userAgent, app = navig

原生JS相容移動的輪播圖

關於輪播圖 : 原生JS 相容IE9+等各大瀏覽器 相容移動端 自適應(根據圖片原比例) 左右箭頭切換 點選索引切換 移動端滑動切換 只需修改圖片路徑 <!DOCTYPE html> <html lang="

原生JS實現移動模組的左右滑動切換效果,基於vue、stylus

原生JS實現移動端模組的左右滑動動畫效果,基於vue、stylus 大概實現方案: 手指touch螢幕的整個過程,會派發touchstart、touchmove、touchend三個事件,對這三個事件設定相應函式,通過移動過程中位置的變化計算出偏移值,進行對應的設定。 注:

原生 js 實現移動 Touch 輪播圖

小編推薦:Fundebug專注於JavaScript、微信小程式、微信小遊戲,Node.js和Java實時BUG監控。真的是一個很好用的bug監控費服務,眾多大佬公司都在使用。 Touch 輪播圖 touch輪播圖其實就是通過手指的滑動,來左右切換輪播圖,下面我們通過一個

H5 Web網頁通過JS(JavaScript)指令碼呼叫Android本地原生方法函式

H5 Web網頁通過JS(JavaScript)指令碼呼叫Android本地原生方法函式 假設現在Android原生程式碼中有一個本地函式:androidNativeSayHello(),打算提供給外部H5頁面使用。 第一步,在Android原生程式碼中準備好提供給H5網頁呼叫的本地原生函式

weex開發 - 方法的對映,在weex呼叫fetch方法,實際呼叫同名的原生方法,在回撥中把資料傳遞迴js

方法的對映通過標題的解釋也可以很明顯的看出來,是通過在js上呼叫和原生同名的方法,在原生返回資料中把這些資料回傳給JS的一種方法,這麼做的原因是weex中的網路請求不能滿足我們客戶端網路安全和各種配置的需求。 具體的做法,首先在weex中,我們寫一個名為fetch.js的網路請求檔案,

原生JS實現移動輪播圖。

話不多說直接上程式碼。html 結構<div class="jd_banner"> <!--圖片--> <ul class="jd_bannerImg clearfix"> <li>

js 移動測試方法總結

1. node外掛anywhere 簡介 一句話隨時隨地將你的當前目錄變成一個靜態檔案伺服器的根目錄。可以在需要測試的專案根目錄下使用,訪問index.html 安裝方法 npm install anywhere -g 使用方法 an

js處理移動有虛擬按鍵影響頁面佈局的處理方法

//針對移動端有虛擬按鍵導致高度短影響整個頁面的佈局給予滾動條處理 function set_screen(wrap){ var s_height = document.body.clientHeight; var s_width = document.body.clien

fastclick.js解決移動(ipad)點擊事件反應慢問題

javascrip tag 區間 spa doc base blog data- ava 參考http://blog.csdn.net/xjun0812/article/details/64919063     http://www.jianshu.com/p/16d3e4

ios移動原生滾動條滾動不靈敏問題

-c 滑動 頁面 webkit class lin 瀏覽器中 自帶 overflow 因為移動端瀏覽器的原生滾動條樣式很好,不像pc端那麽難看,所以在頁面需要滾動的地方用了原生的滾動條,這種滾動條在安卓瀏覽器中沒有任何問題, 但是在ios微信瀏覽器還是自帶瀏覽器中都會反應遲

基於VUE.JS移動框架Mint UI

部分 () cnblogs div 兩個 span stc 方法 從零開始 Mint UI GitHub:github.com/ElemeFE/mint 項目主頁:mint-ui.github.io/# Demo:elemefe.github.io/mint- 文檔:min

第126天:移動-原生實現響應式模態框

flex col 16px position inter tween res doc text 下面采用HTML+CSS+JavaScript實現模態框,並采用Flex布局和多媒體查詢實現響應式。 一、模態框HTML代碼 1 <!DOCTYPE html>

初探JS-html5移動發送指定內容短信到指定號碼

鏈接 nav navigator 屬性 ava inpu params document san 原理:利用a標簽跳轉指定網址: sms://[號碼]?body=[內容] //安卓 sms://[號碼]&body=[內容] //IOS 首先

JS判斷移動還是PC、移動px轉換成rem、移動圓角

JS判斷移動端還是PC判斷PC還是移動if(/AppleWebKit.Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|L

解決clipboad.js移動復制失敗的問題

是個 TE pan 。。 實現原理 highlight adjust 對象 影響 1.前沿   在項目中使用clipboad.js去實現點擊按鈕,自動復制一段網址到剪切板。一開始使用正常,pc端移動端都正常。突然有一個測試提了個bug,復制失敗。簡直一臉懵逼。。。   下面

js實現移動圖片預覽:手勢縮放, 手勢拖動,雙擊放大...

在屏幕上 turn cit format 基礎上 set 邊距 點擊 點擊事件 前言本文將介紹如何通過js實現移動端圖片預覽,包括圖片的 預覽模式,手勢縮放,手勢拖動,雙擊放大等基本功能;