app与js页面交互

在APP中嵌入H5时，往往需要进行交互，此时就需要用到JS交互。

<!DOCTYPE html>
<html>
<head>
<title>starEye</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"/>
<script type="text/javascript" src="https://cdn.staticfile.org/jquery/1.12.4/jquery.js"></script>

<style type="text/css">
.btn {
background-color: #aaa;
height: 40px;
display: flex;
justify-content: center;
align-items: center;
color: #444444;
text-decoration: none;
margin-top: 10px;
}

#response {
background: #eeeeee;
word-wrap: break-word;
display: block;
outline: 1px solid #ccc;
padding: 5px;
margin: 5px;
}
</style>
<script src="js/jquery.js"></script>
</head>
<body>
<p style="color: red"></p>
<p>以webkit的方式实现</p>
<button class="btn" id="login">执行登录操作</button>
<button class="btn" id="logout">执行登出操作</button>

<pre id="response"></pre>

<script type="text/javascript">
/**
* 显示响应信息
* @param response 响应信心
*/
function showResponse(response) {
$('#response').text(response);
}

/**
* jQuery
*/
var url=window.location.href;
$(function () {
$("#login").click(function () {
window.webkit.messageHandlers.login.postMessage({
'url': url,
'password': '123456'
});
});

$('#logout').click(function () {
window.webkit.messageHandlers.logout.postMessage(null);
});
});
</script>
</body>
</html>

 

 

不解可以评论留言或者加微信(yswsxf1314)讨论

posted @ 2021-03-08 10:31  心愿路自平  阅读(310)  评论(0)    收藏  举报