系列教程之mui点击事件及新页面跳转

第一步：引入应对的css\js

<link href="css/mui.min.css" rel="stylesheet" />
<script src="js/mui.min.js"></script>

初始化 mui:

<script type="text/javascript">
	mui.init()
</script>

问题一：点击事件

功能描述：点击确认按钮，弹出hello world

<div class="mui-button-row">
	<button type="button" class="mui-btn mui-btn-primary" id="makeSure">确认</button>
	<button type="button" class="mui-btn mui-btn-danger" >取消</button>
</div>

jquery的写法：

$("#makeSure").on('click',function(){
  alert("hello world");
})

mui写法：

mui('.mui-button-row').on('tap','#makeSure' ,function(event) {
    mui.alert("hello world")
})

问题二：跳转到新页面

功能描述：点击下一页，跳转到secondPage.html

之前 a 标签直接href后面链接地址。

mui写法：

<a class="toNextPage" id="info">下一页</a>
 
document.getElementById('info').addEventListener('tap', function() {
		mui.openWindow({
			url: './secondPage.html', //通过URL传参
		})
});

参考：https://blog.csdn.net/ChibiMarukoChan/article/details/82424075