IOS UIWebView与js的简单交互swift3版
在开发过程中,我们可能遇到ios代码与js交互的情况,本人第一次使用遇到了很多坑,这里纪录一下,方便自己,也方便需要的人。
1.第一步先建一个接口(协议)并继承JSExport
这里实现两个方法提供给js调用的方法
import JavaScriptCore
@objc protocol SwiftJavaScriptDelegate:JSExport{
func show()
func showAlert(_ str:String,_ msg:String)
}
2.第二步需要写一个类去实现上一步的接口(协议)(注意:1.这里必须要继承nsobject否则会报错,2.如果要传参数的话一定要写成
类似与 func showAlert(_ str:String,_ msg:String), _ str:String 这个“_”一定要加不然无法调用(调用无效果),在swift3.0中就这样,其他版本没有测试就不清楚了。
)
@objc class SwiftJavaScriptModel:NSObject,SwiftJavaScriptDelegate{
func show() {
print("js调用我了")
}
func showAlert(_ str:String,_ msg:String){
print("js调用我了:",str,msg)
}
}
3.开始在控制器中测试
//
// ViewController.swift
// WEBJSTest
//
// Created by admin on 17/8/5.
// Copyright © 2017年 tdin360. All rights reserved.
//
import UIKit
import WebKit
import JavaScriptCore
class ViewController: UIViewController,UIWebViewDelegate{
var context:JSContext!
override func viewDidLoad() {
super.viewDidLoad()
self.setupUI()
}
func setupUI( ) {
self.view.addSubview(webView)
let url = Bundle.main.path(forResource: "index", ofType: "html")
self.webView.loadRequest(URLRequest(url: URL(string:url!)!))
self.webView.delegate=self
self.view.addSubview(btn)
}
lazy var webView:UIWebView={
let webView = UIWebView(frame:self.view.bounds)
return webView
}()
//用于点击调用js的按钮
lazy var btn:UIButton={
let btn = UIButton(frame:CGRect(x:0,y:300,width:100,height:40))
btn.backgroundColor=UIColor.blue
btn.setTitle("调用js", for: .normal)
btn.addTarget(self, action: #selector(onClick), for: .touchUpInside)
return btn
}()
//swift调用js
func onClick() {
let f = context?.objectForKeyedSubscript("swift")
_=f?.call(withArguments: [["name":"admin","pass":"fdsfds"]])
}
func webViewDidFinishLoad(_ webView: UIWebView) {
let model = SwiftJavaScriptModel()
//获取context
context = self.webView.value(forKeyPath: "documentView.webView.mainFrame.javaScriptContext") as! JSContext
//这里注册一个标示给js访问
context.setObject(model, forKeyedSubscript:"model" as (NSCopying & NSObjectProtocol)!)
let url = Bundle.main.url(forResource: "index", withExtension: "html")
context.evaluateScript(try? String(contentsOf: url!, encoding: String.Encoding.utf8))
context.exceptionHandler = {
(context, exception) in
print("exception 错误@", exception ?? "")
}
}
override func didReceiveMemoryWarning() {
super.didReceiveMemoryWarning()
}
}
4.html代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
//这个提交给swift调用并传参数
function swift(obj){
alert("swift调用我了"+obj["name"]+"--"+obj["pass"]);
}
</script>
</head>
<body>
<h1>html</h1>
<button onclick="model.showAlert('参数1','参数2')">调用swift(有参数)代码</button>
<button onclick="model.show()">调用swift(无参数)代码</button>
</body>
</html>
这里贴了源码,如果遇到问题欢迎留言,有什么更好的方法欢迎一起交流。
IOS UIWebView与js的简单交互swift3版的更多相关文章
- iOS web与js的简单交互
我们在封装网页的时候经常会遇到需要往网页里面的控件添加数据,但是怎么添加又成了难点.本人最近在开发的时候就遇到这样的事,解决之后,来和大家分享一下. //以必应网站为例 [web loadReques ...
- UIWebView与JS的深度交互
我要实现这样一个需求:按照本地的CSS文件展示一串网络获取的带HTML格式的只有body部分的文本,需要自己拼写完整的 HTML.除此之外,还需要禁用获取的HTML文本中自带的 < img &g ...
- UIWebView与JS的深度交互-b
要实现这样一个需求:按照本地的CSS文件展示一串网络获取的带HTML格式的只有body部分的文本,需要自己拼写完整的 HTML.除此之外,还需要禁用获取的HTML文本中自带的 < img > ...
- 史上最全的 UIWebview 的 JS 与 OC 交互
来源:伯乐在线 - 键盘风筝 链接:http://ios.jobbole.com/89330/ 点击 → 申请加入伯乐在线专栏作者 其实一直想给大家整理一下JS与OC的交互,但是没有合适的机会,今天借 ...
- iOS 使用node js 搭建简单的本地服务器
一.前提:基于iOS 项目 调用,使用了第三方框架NodeMobile.技术说明关键是 应用生命整个周期只能在应用启动时候开辟的一个线程里申请 一个 node js 资源.如果终止了运行,重启是不支 ...
- iOS UIWebView中javascript与Objective-C交互、获取摄像头
UIWebView是iOS开发中常用的一个视图控件,多数情况下,它被用来显示HTML格式的内容. 支持的文档格式 除了HTML以外,UIWebView还支持iWork, Office等文档格式: Ex ...
- UIWebView中JS与OC交互 WebViewJavascriptBridge的使用
一.综述 现在很多的应用都会在多种平台上发布,所以很多程序猿们都开始使用Hybrid App的设计模式.就是在app上嵌入网页,只要写一份网页代码,就可以跑在不同的系统上.在iOS中,app多是通过W ...
- iOS UIWebView 中 js调用OC 打开相册 获取图片, OC调用js 将图片加载到html上
线上html <!DOCTYPE html> <html> <head> <title>HTML中用JS调用OC方法</title> < ...
- iOS UIWebView与JavaScript的交互 相关资料
UIWebView自适应宽度 iOS UIWebView中javascript与Objective-C交互.获取摄像头 iOS中JavaScript和OC交互 iOS与js交互,获取webview完整 ...
随机推荐
- Tomcat_异常_03_Tomcat日志(Logger)中文乱码
一.异常现象 tomcat的日志中出现中文乱码 二.异常解决 2.1 修改catalina.sh文件 在 Tomcat安装目录下的bin目录中,修改catalina.sh文件,第229行. (1)修改 ...
- Linux_笔记_01_设置静态IP与 SecureCRT连接Linux
步骤一至三,即可设置好静态IP 步骤四至九,使SecureCRT连接Linux 步骤一:编辑ifcfg-eth0 文件 1.打开ifcfg-eth0 文件 使用命令:vi /etc/sysconfig ...
- Linux-shell 练习题(一)
1.实现批量添加20个用户,用户名为user1-20,密码为user+123 #!/bin/bash count=$ if [ -n "$count" ] then ;i<= ...
- codeforces 86D D. Powerful array(莫队算法)
题目链接: D. Powerful array time limit per test 5 seconds memory limit per test 256 megabytes input stan ...
- tensorflow中常量(constant)、变量(Variable)、占位符(placeholder)和张量类型转换reshape()
常量 constant tf.constant()函数定义: def constant(value, dtype=None, shape=None, name="Const", v ...
- hdu Digital Square(广搜)
题目:给出n,求出最小的m,满足m^2 % 10^k = n,其中k=0,1,2 http://acm.hdu.edu.cn/showproblem.php?pid=4394 只要有一个x满足条件便 ...
- ngCookies都做了什么
根据官方的api文档,ngCookies的$cookieStore服务,提供了这样几个方法: 1.get(key); 2.put(key, value); 3.remove(key); 以上方法都是对 ...
- Bootstrap日期/日历插件Datepicker 时间加标记
由于工作需要,项目中使用了Bootstrap日期/日历插件Datepicker,根据需求需要在其中添加日期标记,实现效果图如下: 特此记录此次解决方案: 1.首先分析了功能的DOM元素(如下图),可以 ...
- PTA实验作业-01
一.PTA实验作业 本周要求挑3道题目写设计思路.调试过程.设计思路用伪代码描述.题目选做要求: 顺序表选择一题(6-2,6-3,7-1选一题),代码必须用顺序结构抽象数据类型封装 单链表选择一题(6 ...
- 【转】 Pro Android学习笔记(七五):HTTP服务(9):DownloadManager
目录(?)[-] 小例子 保存在哪里下载文件信息设置和读取 查看下载状态和取消下载 文章转载只能用于非商业性质,且不能带有虚拟货币.积分.注册等附加条件,转载须注明出处:http://blog.csd ...