1. 程式人生 > >關於OC和JS的相互呼叫

關於OC和JS的相互呼叫

本文主要講述OC呼叫JS的內部的方法,和用JS來呼叫OC的方法,由於程式碼中已經加了註釋,所以不再贅述。在這裡用本地 HTML 檔案作為說明,HTML檔案如下:

<!doctype html>

<html>

<head>

<meta charset="utf-8">

<title>timer's html</title>

<meta name="viewport"

content="width=device-width,initial-scale=1,minimum-scale=1, maximum-scale=1, user-scalable=no"

>

</head>

<script type="text/javascript">

function jscallswift(){

        jscall1();

    }

function jscallswiftwithPat(){

        jscall2('Timer','2222');

    }

function jscallswiftblock(){

        jscall3('Timer','3333','block');

    }

function jscallblock(block){

        alert(block);

    }

function buttonclick(){

        document.getElementById("button").innerHTML = "改變了"

    }

function buttonclick1(name,num){

        document.getElementById("button1").innerHTML= name+num

    }

</script>

<style>

        #TopView{

display: block;

height: 60px;

line-height

: 60px;

color:#FFFFF0;

margin: 0pxauto;

background: #4169E1;

text-align: center;

font-size: 30px;

        }

        .box li{list-style:none;display:inline-block;}

@media(min-screen:320px) and (max-screen:375px){#mying{height:150px;}

        }

    #myimg{

max-width:200px;

    }

    #myimg img{

width:100%

    }

</style>

<body>

<div id="TopView">首頁</div>

<P id="myimage">

<img src=""alt="">

</P>

<div type ="btn-block"onclick="jscallswift()">js呼叫oc的無引數方法按鈕1</div>

<div type= "btn-block"onclick="jscallswiftwithPat()">js呼叫oc的有引數方法按鈕2</div>

<div type = "btn-block"onclick = "jscallswiftblock()">js呼叫oc的方法並且回撥按鈕3</div>

<p id= "button">會改變的段落</p>

<p id= "button1">有引數的改變</p>

<br>

<div class="box">

<p id= "AddPfromOC"></p>

<ul class="ul1">

<li class="change1">首頁</li>

<li>訂單</li>

<li>我的</li>

<li>渠道管理</li>

<li>商戶管理</li>

</ul>

</div>

<br><br>

</body>

</html>


#import "ViewController.h"

#import <JavaScriptCore/JavaScriptCore.h>

@interface ViewController ()<UIWebViewDelegate> {

UIWebView  *_web;

}

@property(nonatomic,weakJSContext *context;

@end

@implementation ViewController

- (void)viewDidLoad {

    [superviewDidLoad];

// 建立檢視

    [selfcreatUI];

}

#pragma mark - 建立 web 檢視

-(void)creatUI{

// 建立

_web = [[UIWebViewalloc]initWithFrame:self.view.bounds];

_web.backgroundColor = [UIColoryellowColor];

_web.delegate = self;

    [self.viewaddSubview:_web];

// 加載出來本地的 HTML 檔案

NSURL *url = [[NSBundlemainBundle]URLForResource:@"Test"withExtension:@"html"];

NSURLRequest *request = [NSURLRequestrequestWithURL:url];

    [_webloadRequest:request];

// 建立兩個按鈕,用來呼叫 js 內部的方法

UIButton *btn1 =[UIButtonbuttonWithType:UIButtonTypeCustom];

    btn1.frame = CGRectMake(0, 500, 200, 40);

    btn1.backgroundColor = [UIColoryellowColor];

    [btn1 setTitle:@"oc呼叫無引數js"forState:UIControlStateNormal];

    [btn1 setTitleColor:[UIColorredColor] forState:UIControlStateNormal];

    [btn1 addTarget:selfaction:@selector(btn1click) forControlEvents:UIControlEventTouchUpInside];

UIButton *btn2 = [UIButtonbuttonWithType:UIButtonTypeCustom];

    btn2.frame = CGRectMake(0, 580, 200, 40);

    btn2.backgroundColor = [UIColorgreenColor];

    [btn2 setTitle:@"oc呼叫有引數js"forState:UIControlStateNormal];

    [btn2 setTitleColor:[UIColorredColor] forState:UIControlStateNormal];

    [btn2 addTarget:selfaction:@selector(btn2click) forControlEvents:UIControlEventTouchUpInside];

    [self.viewaddSubview:btn1];

    [self.viewaddSubview:btn2];

}

#pragma mark - OC的按鈕開始呼叫JS

/**

  OC 呼叫 JS 的方法裡面,通用的方法是:

 [_web stringByEvaluatingJavaScriptFromString:@"這裡寫JS的方法名字"];

如果無引數,就像第一個按鈕寫的那樣

如果有引數,就像第二個按鈕寫的那樣

當然,得事先知道 js 裡面對應的方法是怎麼寫的。。

 */

// 按鈕1

-(void)btn1click{

    [_webstringByEvaluatingJavaScriptFromString:@"buttonclick()"];

}

// 按鈕2

-(void)btn2click{

NSString *name = @"Kean";

NSString *number = @"is666";

NSString *str = [NSStringstringWithFormat:@"buttonclick1('%@','%@')",name,number];

    [_webstringByEvaluatingJavaScriptFromString:str];

}

#pragma mark - webView 的代理方法的實現

-(BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType

{

//    開始相應請求觸發

returnYES;

}

-(void)webViewDidStartLoad:(UIWebView *)webView{

//    開始載入網頁

}

#pragma mark - JS 呼叫 OC 的方法

/**

  JS 呼叫 OC 的方法

總體來說就是,我通過 JSContext ,來獲取到 JS 的上下文資訊,然後通過上下文和對應的JS中的回撥方法,在回撥方法裡面實現對OC的控制,下面來說具體步驟:

  1. 獲取上下文資訊

 _context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

  2.1 無返回值的型別

 _context[@"JS中回撥方法的名字"] = ^(){

在該 block 塊裡面,可以用OC的程式碼,來做你想要做的事情...

 };

  2.2 有返回值的型別

 _context[@"JS中回撥方法的名字"] = ^(){

在該 block 塊裡面,可以用OC的程式碼,來做你想要做的事情...

除此之外,可以獲取到 JS 返回值...

不過得事先知道返回值是什麼,有幾個

  // (1).獲取存放有返回值的陣列

  NSArray *args = [JSContext currentArguments];

  // (2)從陣列中取到的元素是 JSValue 型別的

  JSValue *name = args[0];

  // (3)轉化成字串?好的

  NSString *nameStr = name.toString;

  // 如果你需要的話,就可以使用 JS 中的特定的返回值 nameStr ;

 };

 */

-(void)webViewDidFinishLoad:(UIWebView *)webView{

//    js中插入一段程式碼

NSString *str = @"document.getElementById('AddPfromOC').innerHTML = '這段文字是由oc加入的js程式碼,在網頁載入完成的時候加入';";

    [webView stringByEvaluatingJavaScriptFromString:str];

//    載入完畢

_context = [webView valueForKeyPath:@"documentView.webView.mainFrame.javaScriptContext"];

_context[@"jscall1"] = ^(){

        [selfchangenav];

    };

_context[@"jscall2"] = ^(){

//      這裡需要對資料操作

NSArray *args = [JSContextcurrentArguments];

// 獲取

JSValue *nameValue = args[0];

JSValue *numValue  = args[1];

// 型別的轉化

NSString *name = nameValue.toString;

NSString *num = numValue.toString;

        [selfchangenavwith:name and:num];

    };

_context[@"jscall3"] = ^(){

NSArray *args = [JSContextcurrentArguments];

JSValue *block = args[2];

NSString *str =  block.toString;

        [selfisOKwith:str];

    };

}

-(void)isOKwith:(NSString *)block{

if ([block isEqualToString:@"bolck"]) {

        [selfbutton3success:block];

    }else{

        [selfbutton3error:block];

    }

}

#pragma mark - JS 呼叫 OC 之後,OC 再次呼叫 JS 的方法(彈出框的方法)

-(void)button3success:(NSString *)block{

NSString *str = [NSStringstringWithFormat:@"jscallblock('校驗成功%@')",block];

    [_webstringByEvaluatingJavaScriptFromString:str];

}

-(void)button3error:(NSString *)block{

NSString *str = [NSStringstringWithFormat:@"jscallblock('校驗失敗%@')",block];

    [_webstringByEvaluatingJavaScriptFromString:str];

}

#pragma mark - JS 呼叫 OC 之後,自定義改變導航的方法

-(void)changenav{

self.navigationItem.title =@"無引數方法呼叫";

}

-(void)changenavwith:(NSString *)name and:(NSString *)number{

self.navigationItem.title =[NSStringstringWithFormat:@"姓名%@,密碼%@",name,number];

}


相關推薦

關於FlashJS相互呼叫的例子

關於Flash和JS相互呼叫的例子已經說很多了,這不是難題,當然,呼叫錯誤這也不是Flash和JS的錯誤,我們今天就來徹底解決IE,FF和Chrome之間的不相容問題! 我們知道,Flash中,如果訪問外部JS函式,只需 flash.external.ExternalInterface.ca

iOS開發ocjs相互呼叫的方式方法

文章主要是介紹oc如何呼叫js 以及js的程式碼呼叫oc的方法  先上程式碼後做解釋 //oc的.m 的程式碼 //ps接下來有js的程式碼一併解析,最後會附上demo //  ViewController.m //  JSAndOC // //  Create

關於OCJS相互呼叫

本文主要講述OC呼叫JS的內部的方法,和用JS來呼叫OC的方法,由於程式碼中已經加了註釋,所以不再贅述。在這裡用本地 HTML 檔案作為說明,HTML檔案如下: <!doctype html> <html> <head> <

C# 用XiliumCefGlue做瀏覽器,JSC#相互呼叫

目錄: XiliumCefGlue初始化,最精簡Demo 1.解壓壓縮包得到下列檔案。選擇需要的檔案複製到自己工程【pdb為除錯生成檔案不需要】,之後將【Xilium.CefGlue】和【Xilium.CefGlue.WindowsForm

OC與swift相互呼叫

OC與swift相互呼叫 一、OC呼叫swift檔案 二、swift呼叫OC檔案 三、注意和總結 新增: 四、自定義橋接檔案  一、OC呼叫swift檔案   在OC專案中建立一個swift檔案的時候,Xcode 會提示 需要建立一個橋接檔案,點

swift專案中 OC與swift相互呼叫

swift呼叫oc的方法: 1、橋接檔案,一般是swift工程,在建立一個oc檔案時,系統自動新增(不用改名,直接預設即可) 2、將需要引用的oc檔案 .h標頭檔案 新增到橋接類中。 具體方法可以參考我的這篇部落格,裡面進行了詳細講解 oc呼叫swift 1、首先設定一

jxbrowser 實現java js互相呼叫(破解版請聯絡作者)

今天我們使用jxbrowser  實現js直接呼叫java程式碼。 呼叫javaTest類的 alert方法。 主要就是給瀏覽器物件新增一個監聽,然後在頁面渲染完成之後,獲取到js的window物件,給window物件新增一個 屬性。 破解版聯絡QQ 92188819

WebBrowser(IE) 與 JS 相互呼叫

在開發中我們經常將WebBrowser控制元件嵌入Winform 程式來瀏覽網頁,既然是網頁那麼少不了JS。下面就讓我們來說說他們兩之間的相互呼叫。 在C#封裝的瀏覽器核心中,Chromium 核心封裝有Xilium.Cefglue、Cefsharp,Webkit 核心封裝

Flex與JS相互呼叫

(1):在Flex中有這麼一個類:ExternalInterface.在這個類中它給我們:call和addCallback Flex中As呼叫Js的方法是:      1、匯入包 (import flash.external.ExternalInterface;)  

WebView使用詳解(一)——Native與JS相互呼叫(附JadX反編譯)

前言:念念不忘,必有迴響,永遠堅持你所堅持的!一直在用WebView,還沒有系統的總結過它的用法,下面就係統的總結下,分享給大家一、基本用法1、載入線上URL[java] view plain copy print?void loadUrl(String url

WKWebView OCJS互動

網頁很簡單,只有一個按鈕,點選按鈕會觸發一個方法,在事件的方法中通過呼叫 window.webkit.messageHandlers.NativeModel.p

安卓與html混合開發之原生與js相互呼叫

原生和html的優缺點就不多說了,有些特定條件下用html頁面可以很方便,也很容易更新和維護,那麼這就涉及到html與安卓原生的互動和通訊。 接下來我要分享的是html呼叫原生的彈窗和位置資訊,安卓原生呼叫JS中的方法。 xml很簡單: <?xml version=

CGo相互呼叫

關注↑↑↑我們獲得更多精彩內容!C可以呼叫Go,並且Go可以呼叫C, 如果更進一步呢, C--&

FlexPaper與js相互呼叫

ExternalInterface.addCallback("pageLoaded", pageLoaded); // 文件載入完成 public function pageLoaded():void {Alert.s

Javagroovy相互呼叫

java interface Java程式碼   package groovy;   public interface IFoo {       public Object run(Object foo, Object bar);   }   groovy implements Java程

支援android&ios高度自適應及JS相互呼叫的元件react-native-webview2

本專案是WebView 或 Web 元件,支援Android、iOS, 支援auto height高度自適應及在html頁面和RN元件之間call js相互呼叫js方法,very useful &a

IOS WebView中JSOC相互呼叫

  現在有很多專案中都涉及到HTML5,在一個普通的APP裡面嵌入HTML5網頁,嵌入的這些網頁在伺服器把頁面修改之後同樣也能跟著修改,這樣就能很方便的修改程式的展示內容。如果使用tabelView或者其他的控制元件展示內容的話,當展示的內容的樣式需要發生改變的

iOS js oc相互呼叫(JavaScriptCore)

從iOS7開始 蘋果公佈了JavaScriptCore.framework 它使得JS與OC的互動更加方便了。 下面我們就簡單瞭解一下這個框架 首先我匯入framework 方法如下 點選Linked Frameworks and Libraries 的

iOS webView的高階用法之JS互動,jsoc相互呼叫(JavaScriptCore)

重要的事情放前面 github地址:https://github.com/horisea/JSCallOCTest   歡迎star 前言:說起JS互動,很多童鞋會黯然色變,感覺很高深的樣子。大部分小夥伴只知道一種,哪一種我也說說吧。    1.在webView中將要

swiftoc相互呼叫,其實很簡單(基於swift4.0)

swift呼叫oc: 需要在統一的bridge標頭檔案(xxx-Bridging-Header.h)裡面import,然後即可使用。 oc呼叫swift: 需要在暴露出來的方法和屬性上加@objc否則不可用;且檔案的類需要繼承自NSObject或NSObjec