1. 程式人生 > >[Swift通天遁地]一、超級工具-(5)使用UIWebView(網頁視圖)加載本地頁面並調用JavaScript(腳本)代碼

[Swift通天遁地]一、超級工具-(5)使用UIWebView(網頁視圖)加載本地頁面並調用JavaScript(腳本)代碼

bound sources 轉換成 height 文本框 bundle 加載本地 self. oftype

本文將演示如何使用UIWebView(網頁視圖)讀取項目中的網頁文件,以及執行JavaScript腳本代碼。

在項目文件夾【DemoApp】上點擊鼠標右鍵,彈出右鍵菜單。

【New File】->【Blank】空白模板->【next】

->【Save As】:Register.html->【Create】

在Register.html中輸入網頁代碼:

 1 <!DOCTYPE HTML>
 2 <html>
 3 <head>
 4     <meta http-equiv="Content-Type" content="
text/html; charset=UTF-8"> 5 <title>Registration</title> 6 <script> 7 function submitForm() 8 { 9 //獲得用戶名的文本框的值 10 var userName = document.getElementById(userName).value 11 //通過彈出警告窗口的方式,顯示文本框的內容 12 alert("
The value of user name is : "+userName); 13 } 14 </script> 15 </head> 16 <body> 17 <form id="registerForm" action="form_action.php" onsubmit="submitForm()"> 18 UserName: <input type="text" id="userName" name="userName"/><br/> 19 Password: <input type="
password" id="password" name="password"/><br/> 20 <input type="submit" value="Submit"/> 21 </form> 22 </body> 23 </html>

在項目導航區,打開視圖控制器的代碼文件【ViewController.swift】

通過UIWebView(網頁視圖)加載上文創建的網頁文件,並調用腳本函數。

 1 import UIKit
 2 
 3 class ViewController: UIViewController {
 4     
 5     //添加一個網頁視圖對象,作為當前類的屬性
 6     var webView:UIWebView!
 7     
 8     override func viewDidLoad() {
 9         super.viewDidLoad()
10         
11         //獲得當前設備的屏幕尺寸信息
12         let bounds = UIScreen.main.bounds
13         //通過屏幕尺寸信息創建一個矩形的顯示區域
14         let frame = CGRect(x: 0, y: 40, width: bounds.width, height: bounds.height)
15         
16         //初始化一個網頁視圖對象,並以矩形區域作為其顯示區域
17         webView = UIWebView(frame: frame)
18         //設置網頁視圖的背景顏色為橙色
19         webView.backgroundColor = UIColor.orange
20         //將網頁視圖添加到當前視圖控制器的根視圖
21         self.view.addSubview(webView)
22         
23         //獲得網頁文件在項目中的路徑
24         let path = Bundle.main.path(forResource: "Register", ofType: "html")
25         //並將路徑轉換成網址的樣式
26         let url = URL(string: path!)
27         //通過網頁視圖的加載請求方法,加載該網址路徑下的網頁文件
28         webView.loadRequest(NSURLRequest(url: url!) as URLRequest)
29         
30         //添加一個按鈕控件,當按鈕被點擊時,將獲得並打印網頁的屬性信息
31         let getInfo = UIButton(frame: CGRect(x: 40, y: 400, width: 240, height: 44))
32         //設置按鈕在正常狀態下的標題文字
33         getInfo.setTitle("Get the information", for: UIControlState.init(rawValue: 0))
34         //設置按鈕的背景顏色為橙色
35         getInfo.backgroundColor = UIColor.orange
36         //給按鈕綁定點擊事件
37         getInfo.addTarget(self, action: #selector(ViewController.getInfo), for: .touchUpInside)
38         
39         //添加第二個按鈕事件,當按鈕被點擊時,將設置網頁表單的內容,並提交該表單
40         let submitForm = UIButton(frame: CGRect(x: 40, y: 470, width: 240, height: 44))
41         //設置按鈕在正常狀態下的標題文字
42         submitForm.setTitle("Set and submit form", for: UIControlState.init(rawValue: 0))
43         //設置按鈕的背景顏色為橙色
44         submitForm.backgroundColor = UIColor.orange
45         //給按鈕綁定點擊事件
46         submitForm.addTarget(self, action: #selector(ViewController.submitForm), for: .touchUpInside)
47         
48         //設置根視圖的背景顏色
49         self.view.backgroundColor = UIColor.orange
50         //將兩個按鈕依次添加到當前視圖控制器的根視圖
51         self.view.addSubview(getInfo)
52         self.view.addSubview(submitForm)
53     }
54     
55     //添加一個方法,用來獲得並打印網頁的屬性信息
56     func getInfo()
57     {
58         //通過網頁視圖的執行腳本命令,執行腳本代碼,此腳本代碼用來獲得網頁所對應的網址字符串
59         let url = webView.stringByEvaluatingJavaScript(from: "document.location.href")
60         //執行第二句腳本代碼,此腳本代碼用來獲得網頁的標題信息
61         let title = webView.stringByEvaluatingJavaScript(from: "document.title")
62         //將獲得的相關信息拼接成一個字符串
63         let info = url! + "\n" + title!
64         //在控制臺打印輸出
65         print(info)
66     }
67     
68     //添加一個方法,用來設置網頁表單的內容,並提交該表單
69     func submitForm()
70     {
71         //初始化一個字符串常量,表示一個腳本語句,
72         //該腳本語句用來設置用戶名文本框的值。
73         let firstJs = "document.getElementById(‘userName‘).value = ‘Jerry‘"
74         //初始化另一個字符串常量,表示一個腳本語句
75         //該腳本語句用來執行指定名稱的函數
76         let secondJs = "submitForm()"
77         //通過網頁視圖的執行腳本命令,
78         //依次執行這兩條腳本語句。
79         webView.stringByEvaluatingJavaScript(from: firstJs)
80         webView.stringByEvaluatingJavaScript(from: secondJs)
81     }
82     
83     override func didReceiveMemoryWarning() {
84         super.didReceiveMemoryWarning()
85         // Dispose of any resources that can be recreated.
86     }
87 }

[Swift通天遁地]一、超級工具-(5)使用UIWebView(網頁視圖)加載本地頁面並調用JavaScript(腳本)代碼