WKWebView与JavaScript交互基础

<!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>

div{

    width:200px;

    height:30px;

    position:absolute;/*绝对坐标*/

    left:50px;

    top:50px;

}

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 ...

随机推荐

UITableViewCell定制
UITableViewCell定制效果特点 1.可以添加不同的TableViewCell,可以定制不同的cell样式; 2.可以动态改变cell的高度; 3.可以随意摆放你cell的位 ...
Android事件分发机制浅谈（三）--源码分析（View篇）
写事件分发源码分析的时候很纠结,网上的许多博文都是先分析的View,后分析ViewGroup.因为我一开始理解的时候是按我的流程图往下走的,感觉方向很对,单是具体分析的时候总是磕磕绊绊的,老要跳到Vi ...
JSPatch来更新已上线的App中出现的BUG(超级详细)
JSPatch的作用是什么呢? 简单来说:(后面有具体的操作步骤以及在操作过程中会出现的错误) 1.iOS应用程序上架到AppStore需要等待苹果公司的审核,一般审核时间需要1到2周.虽然程序在上架 ...
9.PNG的制作
1.背景自适应且不失真问题的存在制作自适应背景图片是UI开发的一个广泛问题,也是界面设计师渴望解决的问题,我相信我们彼此都深有体会. 比如: 1.列表的背景图一定,但是列表的高度随着列表 ...
iOS系列基础篇 06 标签和按钮 (Label & Button)
iOS系列基础篇 06 标签和按钮 (Label & Button) 目录: 标签控件按钮控件小结标签和按钮是两个常用的控件,下面咱们逐一学习. 1. 标签控件使用Single Vi ...
how2heap分析系列:1_first_fit
一些基础知识不再赘述,可以自行搜索解决程序源码first_fit.c #include <stdio.h> #include <stdlib.h> #include < ...
文件上传命令rz和下载命令sz的安装
上一节中,我们已经搭建好了linux环境,现在我们开始使用xshell工具,连接虚拟机. 一.xshell工具简介 Xshell 是一个强大的安全终端模拟软件,它支持SSH1, SSH2, 以及Mic ...
IBM Bluemix体验：Containers
国际版的Bluemix目前有三个region,US South,United Kingdom和Sydney.其中US South是功能最全的,UK其次,Sydney功能最少.Containers服务在 ...
tst、cmp、bne、beq指令
1.tst:逻辑处理指令,用于把一个寄存器的内容和另一个寄存器的内容或立即数进行按位的与运算,并根据运算结果更新CPSR中条件标志位的值.当前运算结果为1,则Z=0:当前运算结果为0,则Z=1 cmp ...
QC在win7下不能访问QC服务器介绍
本地访问不了服务器QC的主要几个原因总结服务器serverjbossextensionhpcmd 2016-03-24 兼容性问题: 1.在服务端QC的安装目录下jboss\server\def ...

WKWebView与JavaScript交互基础

WKWebView与JavaScript交互基础的更多相关文章

随机推荐

热门专题