Skip to content

D
Docs

OpenHarmony / Docs
大约 1 年 前同步成功

通知 159
Star 292
Fork 28
D
Docs

体验新版 GitCode，发现更多精彩内容 >>

未验证 提交 ff8b308d 编写于 作者: O openharmony_ci 提交者： Gitee
浏览文件
操作

!17847 add onAlert&onBeforeUnload&onConfirm&onPrompt to load web pages 

Merge pull request !17847 from 李想/master
上级 a676e06f 8bfecf5e
显示空白变更内容
内联 并排
Showing with 99 addition and 9 deletion
zh-cn/application-dev/reference/apis/js-apis-webview.md
浏览文件 @ ff8b308d
...@@ -4250,7 +4250,7 @@ static saveCookieAsync(callback: AsyncCallback\<void>): void ...@@ -4250,7 +4250,7 @@ static saveCookieAsync(callback: AsyncCallback\<void>): void
| 参数名 | 类型 | 必填 | 说明 | | 参数名 | 类型 | 必填 | 说明 |
| -------- | ---------------------- | ---- | :------------------------------------------------- | | -------- | ---------------------- | ---- | :------------------------------------------------- |
| callback | AsyncCallback\<void> | 是 | 返回cookie是否成功保存的布尔值作为回调函数的入参。 | | callback | AsyncCallback\<void> | 是 | callback回调，用于获取cookie是否成功保存。 |
**示例：** **示例：**
......
zh-cn/application-dev/reference/arkui-ts/ts-basic-components-web.md
浏览文件 @ ff8b308d
...@@ -718,8 +718,6 @@ textZoomAtio(textZoomAtio: number) ...@@ -718,8 +718,6 @@ textZoomAtio(textZoomAtio: number)
```ts ```ts
// xxx.ets // xxx.ets
import web_webview from '@ohos.web.webview'
@Entry @Entry
@Component @Component
struct WebComponent { struct WebComponent {
...@@ -1420,8 +1418,10 @@ onAlert(callback: (event?: { url: string; message: string; result: JsResult }) = ...@@ -1420,8 +1418,10 @@ onAlert(callback: (event?: { url: string; message: string; result: JsResult }) =
controller: web_webview.WebviewController = new web_webview.WebviewController() controller: web_webview.WebviewController = new web_webview.WebviewController()
build() { build() {
Column() { Column() {
Web({ src: 'www.example.com', controller: this.controller }) Web({ src: $rawfile("xxx.html"), controller: this.controller })
.onAlert((event) => { .onAlert((event) => {
console.log("event.url:" + event.url)
console.log("event.message:" + event.message)
AlertDialog.show({ AlertDialog.show({
title: 'onAlert', title: 'onAlert',
message: 'text', message: 'text',
...@@ -1448,6 +1448,25 @@ onAlert(callback: (event?: { url: string; message: string; result: JsResult }) = ...@@ -1448,6 +1448,25 @@ onAlert(callback: (event?: { url: string; message: string; result: JsResult }) =
} }
``` ```
```
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
</head>
<body>
<h1>WebView onAlert Demo</h1>
<button onclick="myFunction()">Click here</button>
<script>
function myFunction() {
alert("Hello World");
}
</script>
</body>
</html>
```
### onBeforeUnload ### onBeforeUnload
onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResult }) => boolean) onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResult }) => boolean)
...@@ -1481,7 +1500,7 @@ onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResu ...@@ -1481,7 +1500,7 @@ onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResu
build() { build() {
Column() { Column() {
Web({ src: 'www.example.com', controller: this.controller }) Web({ src: $rawfile("xxx.html"), controller: this.controller })
.onBeforeUnload((event) => { .onBeforeUnload((event) => {
console.log("event.url:" + event.url) console.log("event.url:" + event.url)
console.log("event.message:" + event.message) console.log("event.message:" + event.message)
...@@ -1511,6 +1530,25 @@ onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResu ...@@ -1511,6 +1530,25 @@ onBeforeUnload(callback: (event?: { url: string; message: string; result: JsResu
} }
``` ```
```
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
</head>
<body onbeforeunload="return myFunction()">
<h1>WebView onBeforeUnload Demo</h1>
<a href="https://www.example.com">Click here</a>
<script>
function myFunction() {
return "onBeforeUnload Event";
}
</script>
</body>
</html>
```
### onConfirm ### onConfirm
onConfirm(callback: (event?: { url: string; message: string; result: JsResult }) => boolean) onConfirm(callback: (event?: { url: string; message: string; result: JsResult }) => boolean)
...@@ -1544,11 +1582,10 @@ onConfirm(callback: (event?: { url: string; message: string; result: JsResult }) ...@@ -1544,11 +1582,10 @@ onConfirm(callback: (event?: { url: string; message: string; result: JsResult })
build() { build() {
Column() { Column() {
Web({ src: 'www.example.com', controller: this.controller }) Web({ src: $rawfile("xxx.html"), controller: this.controller })
.onConfirm((event) => { .onConfirm((event) => {
console.log("event.url:" + event.url) console.log("event.url:" + event.url)
console.log("event.message:" + event.message) console.log("event.message:" + event.message)
console.log("event.result:" + event.result)
AlertDialog.show({ AlertDialog.show({
title: 'onConfirm', title: 'onConfirm',
message: 'text', message: 'text',
...@@ -1575,6 +1612,34 @@ onConfirm(callback: (event?: { url: string; message: string; result: JsResult }) ...@@ -1575,6 +1612,34 @@ onConfirm(callback: (event?: { url: string; message: string; result: JsResult })
} }
``` ```
```
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
</head>
<body>
<h1>WebView onConfirm Demo</h1>
<button onclick="myFunction()">Click here</button>
<p id="demo"></p>
<script>
function myFunction() {
let x;
let r = confirm("click button!");
if (r == true) {
x = "ok";
} else {
x = "cancel";
}
document.getElementById("demo").innerHTML = x;
}
</script>
</body>
</html>
```
### onPrompt<sup>9+</sup> ### onPrompt<sup>9+</sup>
onPrompt(callback: (event?: { url: string; message: string; value: string; result: JsResult }) => boolean) onPrompt(callback: (event?: { url: string; message: string; value: string; result: JsResult }) => boolean)
...@@ -1606,7 +1671,7 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul ...@@ -1606,7 +1671,7 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul
build() { build() {
Column() { Column() {
Web({ src: 'www.example.com', controller: this.controller }) Web({ src: $rawfile("xxx.html"), controller: this.controller })
.onPrompt((event) => { .onPrompt((event) => {
console.log("url:" + event.url) console.log("url:" + event.url)
console.log("message:" + event.message) console.log("message:" + event.message)
...@@ -1623,7 +1688,7 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul ...@@ -1623,7 +1688,7 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul
secondaryButton: { secondaryButton: {
value: 'ok', value: 'ok',
action: () => { action: () => {
event.result.handleConfirm() event.result.handlePromptConfirm(event.value)
} }
}, },
cancel: () => { cancel: () => {
...@@ -1637,6 +1702,30 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul ...@@ -1637,6 +1702,30 @@ onPrompt(callback: (event?: { url: string; message: string; value: string; resul
} }
``` ```
```
<!--xxx.html-->
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" charset="utf-8">
</head>
<body>
<h1>WebView onPrompt Demo</h1>
<button onclick="myFunction()">Click here</button>
<p id="demo"></p>
<script>
function myFunction() {
let message = prompt("Message info", "Hello World");
if (message != null && message != "") {
document.getElementById("demo").innerHTML = message;
}
}
</script>
</body>
</html>
```
### onConsole ### onConsole
onConsole(callback: (event?: { message: ConsoleMessage }) => boolean) onConsole(callback: (event?: { message: ConsoleMessage }) => boolean)
...@@ -1690,6 +1779,7 @@ onDownloadStart(callback: (event?: { url: string, userAgent: string, contentDisp ...@@ -1690,6 +1779,7 @@ onDownloadStart(callback: (event?: { url: string, userAgent: string, contentDisp
| 参数名 | 参数类型 | 参数描述 | | 参数名 | 参数类型 | 参数描述 |
| ------------------ | ------------- | ----------------------------------- | | ------------------ | ------------- | ----------------------------------- |
| url | string | 文件下载的URL。 | | url | string | 文件下载的URL。 |
| userAgent | string | 用于下载的用户代理。 |
| contentDisposition | string | 服务器返回的 Content-Disposition响应头，可能为空。 | | contentDisposition | string | 服务器返回的 Content-Disposition响应头，可能为空。 |
| mimetype | string | 服务器返回内容媒体类型（MIME）信息。 | | mimetype | string | 服务器返回内容媒体类型（MIME）信息。 |
| contentLength | contentLength | 服务器返回文件的长度。 | | contentLength | contentLength | 服务器返回文件的长度。 |
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或