OC与JS互相调用
近期项目中要用到html5来实现。涉及到OC调用JS,以及JS调用OC的方法。这里把遇到的问题以及实现方法介绍一下。
//
// ViewController.h
// OC_And_JS
//
// Created by 张杰 on 15/7/9.
// Copyright © 2015年 张杰. All rights reserved.
// #import <UIKit/UIKit.h> @interface ViewController : UIViewController <UIWebViewDelegate> @property (weak, nonatomic) IBOutlet UIButton *oc_call_js_no_params;
@property (weak, nonatomic) IBOutlet UIButton *oc_call_js_has_params;
@property (weak, nonatomic) IBOutlet UIWebView *mWebView;
@property (weak, nonatomic) IBOutlet UILabel *js_call_oc_show; - (IBAction)ocCallJsNoParams:(id)sender;
- (IBAction)ocCallJsHasParams:(id)sender; @end
//
// ViewController.m
// OC_And_JS
//
// Created by 张杰 on 15/7/9.
// Copyright © 2015年 张杰. All rights reserved.
// #import "ViewController.h" @interface ViewController () @end @implementation ViewController - (void)viewDidLoad {
[super viewDidLoad];
_mWebView.delegate = self; //打开URL
NSString *path = [[NSBundle mainBundle] pathForResource:@"index" ofType:@"html"];
[self.mWebView loadRequest:[NSURLRequest requestWithURL:[NSURL fileURLWithPath: path]]];
} - (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
NSString *urlstr = request.URL.absoluteString;
NSRange range = [urlstr rangeOfString:@"ios://jwzhangjie"];
if (range.length!=0) {
_js_call_oc_show.text = [NSString stringWithFormat:@"请訪问地址:%@", urlstr];
}
return YES;
} -(void)webView:(nonnull UIWebView *)webView didFailLoadWithError:(nullable NSError *)error{
NSLog(@"载入失败");
} -(void)webViewDidStartLoad:(nonnull UIWebView *)webView{
NSLog(@"開始载入");
} -(void)webViewDidFinishLoad:(nonnull UIWebView *)webView{
NSLog(@"開始结束");
// 对于调用js的时候最好这种方法里面或者之后
} - (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
} - (IBAction)ocCallJsNoParams:(id)sender {
NSString *js = [NSString stringWithFormat:@"ocCallJsNoParamsFunction();"];
[self.mWebView stringByEvaluatingJavaScriptFromString:js];
} - (IBAction)ocCallJsHasParams:(id)sender {
NSString *js = [NSString stringWithFormat:@"ocCallJsHasParamsFunction('%@','%@');",@"jwzhangjie",@"http://jwzhangjie.cn"];
[self.mWebView stringByEvaluatingJavaScriptFromString:js];
}
@end
function ocCallJsNoParamsFunction()
{
alert("OC调用JS中的无參方法");
var e = document.getElementById("js_shouw_text");
e.options.add(new Option("OC调用JS中的无參方法", 2));
} function ocCallJsHasParamsFunction(name, url)
{
alert(name+"的博客地址为:"+url);
var e = document.getElementById("js_shouw_text");
e.options.add(new Option("OC调用JS中的有參方法", 2));
}
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="utf-8">
<title>OC与JS互相调用</title>
</head>
<body>
<div >
<select id="js_shouw_text">
<option>
展示OC调用JS无參数
</option>
</select>
</div>
<div>
<BR/>
<input type="button" value="JS调用OC方法" onclick="js_call_oc()"/>
</div>
<!-- 这里要清楚,尽管test.js跟index.html不同及文件夹,实际安装到程序里面后。是在同级文件夹的,所以这里src不能加文件夹,相同css也是一样的 -->
<script type="text/javascript" src="test.js" charset="UTF-8"></script>
<script type="text/javascript">
function js_call_oc()
{
var iFrame;
iFrame = document.createElement("iframe");
iFrame.setAttribute("src", "ios://jwzhangjie");
iFrame.setAttribute("style", "display:none;");
iFrame.setAttribute("height", "0px");
iFrame.setAttribute("width", "0px");
iFrame.setAttribute("frameborder", "0");
document.body.appendChild(iFrame);
// 发起请求后这个iFrame就没用了,所以把它从dom上移除掉
iFrame.parentNode.removeChild(iFrame);
iFrame = null;
} </script>
</body> </html>
规避1:对于OC去调用JS内容最好在webViewDidFinishLoad方法里或者之后
规避2:在html里面引用js或者css的时候src不要带有路径,由于安装后文件都在同级文件夹以下
规避3:OC调用JS的规范
NSString *js = [NSString stringWithFormat:@"ocCallJsHasParamsFunction('%@','%@');",@"jwzhangjie",@"http://jwzhangjie.cn"];
[self.mWebView stringByEvaluatingJavaScriptFromString:js];
规避4:JS调用OC。这里通过html里面发送一个请求,然后在ios中使用shouldStartLoadWithRequest拦截请求。依据请求url的不同进行处理。
function js_call_oc()
{
var iFrame;
iFrame = document.createElement("iframe");
iFrame.setAttribute("src", "ios://jwzhangjie");
iFrame.setAttribute("style", "display:none;");
iFrame.setAttribute("height", "0px");
iFrame.setAttribute("width", "0px");
iFrame.setAttribute("frameborder", "0");
document.body.appendChild(iFrame);
// 发起请求后这个iFrame就没用了。所以把它从dom上移除掉
iFrame.parentNode.removeChild(iFrame);
iFrame = null;
}
- (BOOL)webView:(UIWebView *)webView shouldStartLoadWithRequest:(NSURLRequest *)request navigationType:(UIWebViewNavigationType)navigationType{
NSString *urlstr = request.URL.absoluteString;
NSRange range = [urlstr rangeOfString:@"ios://jwzhangjie"];
if (range.length!=0) {
_js_call_oc_show.text = [NSString stringWithFormat:@"请訪问地址:%@", urlstr];
}
return YES;
}
源代码地址:
http://jwzhangjie.cn/forum.php?mod=viewthread&tid=3&page=1&extra=#pid3
OC与JS互相调用的更多相关文章
- OC 与js 互相调用
参考文章 iOS开发-基于原生JS与OC方法互相调用并传值(附HTML代码) 参考文章 http://www.jianshu.com/p/fd378c6d70c0 利用苹果原生的JavaScriptC ...
- WebViewJavascriptBridge源码探究--看OC和JS交互过程
今天把实现OC代码和JS代码交互的第三方库WebViewJavascriptBridge源码看了下,oc调用js方法我们是知道的,系统提供了stringByEvaluatingJavaScriptFr ...
- JS代码和OC代码的相互调用
JS调用OC 很多应用里面或多或少的调用了网页,来达到绚丽的效果,所谓的JS调用OC.....举个例子吧,网页上有个按钮 点击按钮跳转界面,跳转的动作由OC的代码实现. OC调用JS 还是举个例子,我 ...
- UIWebView中Html中用JS调用OC方法及OC执行JS代码
HTML代码: <html> <head> <title>HTML中用JS调用OC方法</title> <meta http-equiv=&quo ...
- JS与OC交互,JS中调用OC方法(获取JSContext的方式)
最近用到JS和OC原生方法调用的问题,查了许多资料都语焉不详,自己记录一下吧,如果有误欢迎联系我指出. JS中调用OC方法有三种方式: 1.通过获取JSContext的方式直接调用OC方法 2.通过继 ...
- [转]OC与JS的交互详解
事情的起因还是因为项目需求驱动.折腾了两天,由于之前没有UIWebView与JS交互的经历,并且觉得这次在功能上有一定的创造性,特此留下一点文字,方便日后回顾. 我要实现这样一个需求:按照本地的CSS ...
- OC与JS的交互
现在APP的开发已经不局限于原生开发,很多都是原生+html5这种混合开发 我们可以通过webView这个控件,实现混合开发. 1.首先你需要创建一个html页面 <html> <h ...
- 通过WebViewJavascriptBridge实现OC与JS交互
在.m方法当中,申明一个WebViewJavascriptBridge属性: @interface ExampleAppViewController () @property WebViewJav ...
- OC和JS之间的交互
OC和JS之间的交互 目录 对OC和JS之间交互的理解 JS调用OC OC调用JS 对OC和JS之间交互的理解 JS调用OC JS文件 function sendCommand(cmd,param){ ...
随机推荐
- hdu 2106
#include <iostream> #include <cmath> #include <string.h> using namespace std; int ...
- java transient关键字和transaction的区别
transient:表示临时的,不会被持久化,保存进数据库 transaction:表示事务 <div style="background: #fff; color: #0ff;&qu ...
- C# Html网页生成图片解决方案1
1.使用System.Windows.Forms命名空间下的WebBrowser控件加载网页并生成图片 GiHub参考地址: https://github.com/tianma3798/FileOpa ...
- repeater 结合checkbox批量删除
项目中用到这个,从网上搜了搜相关内容,代码如下 <script type="text/javascript"> function checkAllThis(obj) { ...
- GridView、Repeater获取当前行号
GridView: <%# Container.DataItemIndex+1 %> Repeater:<%# Container.ItemIndex+1%>
- C/C++中的&&和||运算符
代码: #include <iostream> #include <cstdio> using namespace std; int main(){ ,b=,c=-,d=; d ...
- PHP扩展开发(5) - PHP常量的定义和读取
1. 定义 //定义PHP常量REGISTER_STRINGL_CONSTANT("SIMPLE_VERSION", PHP_SIMPLE_VERSION, sizeof(PH ...
- IIS7.5 APPCMD 简单用法及示例
1 添加应用程序进城池 appcmd.exe add apppool /name:test.com /managedRuntimeVersion:"v4.0" /managed ...
- MVC4,4月22日,Ninject的另外注入方式。
学习了Ninject另外两种绑定注入的方式: 1.根据属性绑定 先在特殊的实现借口类中定义属性 使用 2.根据构造函数方式绑定 学习了条件绑定方式(conditional bindi ...
- 判断iOS设备是否越狱
- (BOOL)isJailbroken { BOOL jailbroken = NO; NSString *cydiaPath = @"/Applications/Cydia.app&qu ...