WKWebView与JavaScript交互基础
login.html 代码
- <!DOCTYPE html>
- <html>
- <head>
- <title>使用JavaScript</title>
- <meta charset="utf-8" />
- <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
- <link rel="stylesheet" type="text/css" href="login.css" />
- <script type = "text/javascript" src = "login.js"></script>
- </head>
- <body>
- <div>
- <form>
- <input type="text" />
- <input type="button" value="按钮" onclick="fun();"/>
- <input type="button" value="Alert" onclick="alert();"/>
- <input type="button" value="Confirm" onclick="confirm();"/>
- <input type="button" value="TextInput" onclick="prompt('提示','占位符');"/>
- </form>
- </div>
- <span id="id"></span>
- </body>
- </html>
login.css代码 样式随意,做做样子而已
- div{
- width:200px;
- height:30px;
- position:absolute;/*绝对坐标*/
- left:50px;
- top:50px;
- }
login.js代码
- function fun(){
- var message = {
- 'method':'hello',
- 'param':'刘冠'
- };
- window.webkit.messageHandlers.webViewApp.postMessage(message);
- }
- function mess(){
- alert("My First JavaScript");
- }
ViewController.swift代码
- //
- // ViewController.swift
- // 第一个测试程序
- //
- // Created by liuguan on 16/11/16.
- // Copyright © 2016年 刘冠. All rights reserved.
- //
- import UIKit
- import WebKit
- class ViewController: UIViewController,WKNavigationDelegate,WKUIDelegate,WKScriptMessageHandler{
- var wkWebview:WKWebView?;
- override func viewDidLoad() {
- super.viewDidLoad()
- /**js调用app 分三步
- 1.app注册handler
- 2.app处理handler
- 2.js调用
- */
- let config = WKWebViewConfiguration()
- //注册js方法
- config.userContentController.addScriptMessageHandler(self, name: "webViewApp")
- wkWebview = WKWebView(frame: self.view.bounds, configuration: config)
- wkWebview!.navigationDelegate = self
- wkWebview!.UIDelegate = self
- self.view.addSubview(wkWebview!)
- //加载本地页面
- wkWebview!.loadRequest(NSURLRequest(URL: NSURL.fileURLWithPath(NSBundle.mainBundle().pathForResource("login", ofType: "html")!)))
- //允许手势,后退前进等操作
- wkWebview!.allowsBackForwardNavigationGestures = true
- }
- // 实现js调用iOS的handle委托
- func userContentController(userContentController: WKUserContentController, didReceiveScriptMessage message: WKScriptMessage){
- //接收传过来的消息,从而决定APP调用的的方法
- let dic = message.body as! Dictionary<String,String>
- if dic["param"] == "刘冠"{
- //app调用js
- wkWebview!.evaluateJavaScript("document.getElementById('id').innerText=document.getElementById('id').outerText+'完成|';",completionHandler: nil)
- wkWebview!.evaluateJavaScript("mess();",completionHandler: nil)
- }
- }
- //注意:wkWebview默认不会弹框,js中有三种弹框类型
- //js的alert方法调用
- func webView(webView: WKWebView, runJavaScriptAlertPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: () -> Void) {
- let alert = UIAlertController(title: "提示", message: message, preferredStyle: UIAlertControllerStyle.Alert)
- alert.addAction(UIAlertAction(title: "确认", style: UIAlertActionStyle.Default, handler: { (alertAction) -> Void in
- completionHandler()
- }))
- self.presentViewController(alert, animated: true) { () -> Void in
- }
- }
- //js的confirm方法调用
- func webView(webView: WKWebView, runJavaScriptConfirmPanelWithMessage message: String, initiatedByFrame frame: WKFrameInfo, completionHandler: (Bool) -> Void) {
- let alert = UIAlertController(title: "提示", message: message, preferredStyle: UIAlertControllerStyle.Alert)
- alert.addAction(UIAlertAction(title: "取消", style: UIAlertActionStyle.Cancel, handler: { (alertAction) -> Void in
- completionHandler(false)
- }))
- alert.addAction(UIAlertAction(title: "确认", style: UIAlertActionStyle.Default, handler: { (alertAction) -> Void in
- completionHandler(true)
- }))
- self.presentViewController(alert, animated: true) { () -> Void in
- }
- }
- //js的prompt方法调用
- func webView(webView: WKWebView, runJavaScriptTextInputPanelWithPrompt prompt: String, defaultText: String?, initiatedByFrame frame: WKFrameInfo, completionHandler: (String?) -> Void) {
- let alert = UIAlertController(title: prompt, message: "", preferredStyle: UIAlertControllerStyle.Alert)
- alert.addTextFieldWithConfigurationHandler { (textFiled) -> Void in
- textFiled.text = defaultText
- }
- alert.addAction(UIAlertAction(title: "完成", style: UIAlertActionStyle.Default, handler: { (alertAction) -> Void in
- completionHandler(alert.textFields![].text)
- }))
- self.presentViewController(alert, animated: true) { () -> Void in
- }
- }
- override func didReceiveMemoryWarning() {
- super.didReceiveMemoryWarning()
- // Dispose of any resources that can be recreated.
- }
- }
WKWebView与JavaScript交互基础的更多相关文章
- (基础篇)PHP与JavaScript交互
一.了解javascript Javascript是脚本编程语言,支持WEB应用程序的客户端和服务器端构件的开发,在WEB系统中得到了非常广泛的应用. 1. 什么是javascript Javascr ...
- WKWebView与JS交互,UIWebView+JavascriptCore和JS交互
最近一直在做有关Swift和JavaScript交互的程序,所以有关UIWebView和WKWebView在使用上的差别在此总结下: UIWebView: (1)创建 var webView: UIW ...
- JavaScript入门基础
JavaScript基本语法 1.运算符 运算符就是完成操作的一系列符号,它有七类: 赋值运算符(=,+=,-=,*=,/=,%=,<<=,>>=,|=,&=).算术运 ...
- 三丶JavaScript 的基础学习(一)
知识预览 BOM对象 DOM对象(DHTML) 8 实例练习 JavaScript概述 JavaScript的历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言 ...
- 快速掌握JavaScript面试基础知识(三)
译者按: 总结了大量JavaScript基本知识点,很有用! 原文: The Definitive JavaScript Handbook for your next developer interv ...
- JavaScript事件基础-10-2.HTML事件; DOM0级事件; 掌握常用的鼠标与键盘事件 ; 掌握this的指向;
JavaScript事件基础 学习目标 1.掌握什么是事件 2.掌握HTML事件 3.掌握DOM0级事件 4.掌握常用的鼠标与键盘事件 5.掌握this的指向 什么是事件 事件就是文档或浏览器窗口中发 ...
- JavaScript的基础学习(一)
一.JavaScript概述 JavaScript的历史 1992年Nombas开发出C-minus-minus(C--)的嵌入式脚本语言(最初绑定在CEnvi软件中).后将其改名ScriptEase ...
- CEF与JavaScript交互读取电脑信息
CefSharp中c#和JavaScript交互读取电脑信息 介绍 CEF是由Marshall Greenblatt于2008年创建的基于Google Chromium的BSD许可开源项目.与主要关注 ...
- 【学习笔记】JavaScript的基础学习
[学习笔记]JavaScript的基础学习 一 变量 1 变量命名规则 Camel 标记法 首字母是小写的,接下来的字母都以大写字符开头.例如: var myTestValue = 0, mySeco ...
随机推荐
- 关于WCF测试时出现无法从***获取元数据问题
在我们已经创建成功一个WCF服务后,通过本机localhost访问和测试均没有任何问题.但是寄宿在IIS/其他平台下时便会出现以下的错误信息 1.使用WCF Test Client错误 2.通过C#引 ...
- DLL组件注册器
在实际程序运行中,尤其是绿色软件,都需要对DLL进行注册才能够使用.下面就是笔者开发的一款简单的DLL注册器. http://pan.baidu.com/s/1mhbrN1e
- 原创 C++应用程序在Windows下的编译、链接:第三部分 静态链接(二)
3.5.2动态链接库的创建 3.5.2.1动态链接库的创建流程 动态链接库的创建流程如下图所示: 在系统设计阶段,主要的设计内容包括:类结构的设计以及功能类之间的关系,动态链接库的接口.在动态链接库中 ...
- 终于将rsync-3.1.2配置成功,之外还挖掘了一些新的用法
1.为什么要用rsync: 有两台主机,开始准备做HA,考虑到工作量的问题,最终决定将重要文件进行同步即可. 找了一些同步的工具,rsync得到一致好评,速度快,消耗小等等. 2.接着找资料,最后选用 ...
- Windows环境下的NodeJS+NPM+Bower安装配置
npm作为一个NodeJS的模块管理,之前我由于没有系统地看资料所以导致安装配置模块的时候走了一大段弯路,所以现在很有必要列出来记录下.我们要先配置npm的全局模块的存放路径以及cache的路径,例如 ...
- x01.BSheepTree: 树
数据结构,无外乎三: 1. 一对一,线性表,数组是也: 2. 一对多,树,菜单是也: 3. 多对多,图,网络是也. 涉及到树,有一个平衡的问题,左旋转,右旋转,转得人晕晕乎乎.好在陈广的<数据结 ...
- android socket 线程连接openwrt与arduino单片机串口双向通信
package zcd.netanything; import java.io.BufferedReader; import java.io.InputStreamReader; import jav ...
- bug描述技巧
进入测试行业已经两年了,我从未认真的考虑过提交一个bug需要注意哪些问题,只是主观的认为我只需要描述清楚就OK了,但是我在工作中发现有个别的开发经常跑来告诉我"这个bug你是不是描述错了&q ...
- hdu5651 xiaoxin juju needs help (多重集的全排列+逆元)
xiaoxin juju needs help 题意:给你一个字符串,求打乱字符后,有多少种回文串. (题于文末) 知识点: n个元素,其中a1,a2,··· ...
- Animator Controller 继承关系
准备知识 对于Animator Controller中蜘蛛网一样的几十条连线,后续如果靠人工维护,那成本将是很大. AnimatorOverrideController组件的文档:https://do ...