Mui-页面跳转

DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>title>
<script src="js/mui.min.js">script>
<link href="css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8">
    mui.init();
script>

head>

<body>
<header class="mui-bar mui-bar-nav">
    
    <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left">a>
    <h1 class="mui-title">窗口管理-跳转子页面h1>
header>
<nav class="mui-bar mui-bar-tab">
    <a class="mui-tab-item mui-active">
        <span class="mui-icon mui-icon-home">span>
        <span class="mui-tab-label">首页span>
    a>
    <a class="mui-tab-item" id="tab2">
        <span class="mui-icon mui-icon-phone">span>
        <span class="mui-tab-label">电话span>
    a>
    <a class="mui-tab-item">
        <span class="mui-icon mui-icon-email">span>
        <span class="mui-tab-label">邮件span>
    a>
    <a class="mui-tab-item">
        <span class="mui-icon mui-icon-gear">span>
        <span class="mui-tab-label">设置span>
    a>
nav>
<script type="text/javascript">
    /*判断h5+插件是否加载完毕*/
    mui.plusReady(function(){
        document.getElementById('tab2').addEventListener('tap',function(){
            mui.openWindow({
                url : 'tel.html',
                id : 'tel.html'
            });
        });
    });
    
script>
body>

html>

方法一

tel.html

doctype html>
<html>

<head>
<meta charset="UTF-8">
<title>title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<link href="css/mui.min.css" rel="stylesheet" />
head>

<body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left">a>
        <h1 class="mui-title">拨打电话h1>
    header>
    <div class="mui-content">
        187306308888
    div>
<script src="js/mui.min.js">script>
<script type="text/javascript">
    mui.init()
script>
body>

html>

方法二-----

DOCTYPE html>
<html>

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<title>title>
<script src="js/mui.min.js">script>
<link href="css/mui.min.css" rel="stylesheet" />
<script type="text/javascript" charset="utf-8">
    mui.init();
script>

head>

<body><div class="mui-content">
    <button type="button" onclick="tel();">打电话button>
div>
<nav class="mui-bar mui-bar-tab">
    <a class="mui-tab-item mui-active">
        <span class="mui-icon mui-icon-home">span>
        <span class="mui-tab-label">首页span>
    a>
    <a class="mui-tab-item" id="tab2">
        <span class="mui-icon mui-icon-phone">span>
        <span class="mui-tab-label">电话span>
    a>
    <a class="mui-tab-item">
        <span class="mui-icon mui-icon-email">span>
        <span class="mui-tab-label">邮件span>
    a>
    <a class="mui-tab-item">
        <span class="mui-icon mui-icon-gear">span>
        <span class="mui-tab-label">设置span>
    a>
nav>
<script type="text/javascript">
    /*判断h5+插件是否加载完毕*/
    mui.plusReady(function(){
        document.getElementById('tab2').addEventListener('tap',function(){
            mui.openWindow({
                url : 'tel.html',
                id : 'tel.html'
            });
        });
    });
    function tel(){
        mui.openWindow({
            url:"tel.html",
            id:"tel.html"
        });
    }
script>
body>

html>

 

转载于:https://www.cnblogs.com/fdxjava/p/11073693.html

你可能感兴趣的:(Mui-页面跳转)