Uncaught TypeError:无法在OnsenUI中将null的属性“ onclick”设置为null

时间:2019-03-04 07:38:33

标签: javascript onsen-ui dom-events onsen-ui2

我正在使用Visual Studio,cordova和onsen-ui框架开发混合应用程序, 这是我用于页面导航的javascript代码

document.addEventListener('init', function (event) {
    var page = event.target;
        if (page.id === 'index') {
            page.querySelector('#push-button').onclick = function () {
                document.querySelector('#loginNavigator').pushPage('register.html', { data: { title: 'Register Your Profile' } });
            };
            page.querySelector('#forgot-password').onclick = function () {
                document.querySelector('#loginNavigator').pushPage('forgotPassword.html', { data: { title: 'Forgot Password?' } });
            };
        } else if (page.id === 'register') {
            page.querySelector('ons-toolbar .center').innerHTML = page.data.title;
        }
        else if (page.id === 'forgot') {
            page.querySelector('ons-toolbar .center').innerHTML = page.data.title;
        }
        else if (page.id === 'dashboard')
        {
            page.querySelector('#leadPage').onclick = function () {
                document.querySelector('#loginNavigator').pushPage('vendor/leads.html', { data: { title: 'My Leads' } });
            };
        }


});

并且如果用户已经登录并打开应用程序,那么我已经使用此代码

function onload()
{
    document.addEventListener("deviceready", onDeviceReady, false);

}
function onDeviceReady() {
    if (localStorage.getItem('login') == 'TRUE') {
        loginNavigator.replacePage('dashboard.html');
        dashboard();
    }
}

并且在我体内,我已经在使用onload="onload()",所以我的问题是,登录到我的应用程序后,页面被dashboard.html替换,并且如果没有点击任何页面,则显示此错误dashboard.html页面,我不知道我在做什么错,请帮帮我,错误是

  

未被捕获的TypeError:无法将属性'onclick'设置为null

这是我的dashboard.html页面

<ons-page id="vendorLeads">
    <section class="bg-dashboard">
        <section class="width100">
            <div class="width50 ft-lt" id="leadPage">

                    <div class="iconClass">
                        <ons-icon icon="fa-id-card"></ons-icon>
                    </div>
                    <div class="textClass">
                        <div class="text-area">My Leads</div>
                        <div class="total-value"></div>
                    </div>

            </div>
            <div class="width50 ft-rt">
                <div class="iconClass">
                    <ons-icon icon="fa-address-book"></ons-icon>
                </div>
                <div class="textClass">
                    <div class="text-area">Queries</div>
                    <div class="total-value"></div>
                </div>

            </div>
        </section>
        <section class="width100">
            <div class="width50 ft-lt">
                <div class="iconClass">
                    <ons-icon icon="fa-envelope"></ons-icon>
                </div>
                <div class="textClass">
                    <div class="text-area">Inbox</div>
                    <div class="total-value">(coming soon)</div>
                </div>
            </div>
            <div class="width50 ft-rt">
                <div class="iconClass">
                    <ons-icon icon="fa-heart"></ons-icon>
                </div>
                <div class="textClass">
                    <div class="text-area">Shortlist</div>
                    <div class="total-value"></div>
                </div>
            </div>
        </section>
        <section class="width100">
            <div class="width50 ft-lt">
                <div class="iconClass">
                    <ons-icon icon="fa-check"></ons-icon>
                </div>
                <div class="textClass">
                    <div class="text-area">Profile Visit</div>
                    <div class="total-value"></div>
                </div>
            </div>
            <div class="width50 ft-rt">
                <div class="iconClass">
                    <ons-icon icon="fa-paper-plane"></ons-icon>
                </div>
                <div class="textClass">
                    <div class="text-area">Contact Click</div>
                    <div class="total-value"></div>
                </div>
            </div>
        </section>
    </section>
</ons-page>

这是我的index.html页面

<body onload="onload()">
    <ons-navigator swipeable id="loginNavigator" page="index.html"></ons-navigator>
    <template id="index.html">
        <ons-page id="index">
            <div class="page no-navbar">
                <div class="page-content login-cover-width-img">

                    <div class="padding">

                        <div class="logo-area">
                            <img src="images/logowhite3.png" class="img-logo">

                        </div>

                        <div class="login-panel">



                            <h5 class="vedor-heading1">Login to manage your account</h5>
                            <div class="from-wrapper">
                                <div class="form-item">
                                    <div class="form-item-title">

                                    </div>
                                    <div class="form-item-content">
                                        <input type="email" placeholder="username" id="username"  class="form-control usericon" required="required">
                                    </div>
                                </div>
                                <div class="form-item">
                                    <div class="form-item-title">

                                    </div>
                                    <div class="form-item-content">
                                        <input type="password" placeholder="Password" id="password"  class="form-control passicon" required="required">
                                    </div>

                                </div>
                            </div>

                            <a id="login" class="col button button-fill button-big color-black" onclick="loginVendor()">Login</a>
                            <div class="form-item-desc">
                                <a href="#" id="forgot-password" class="forget-password">Forgot password?</a>
                            </div>

                        </div>

                        <div class="login-footer">

                            <a href="#" id="push-button" class="create-account-button">Create Account</a>
                        </div>

                    </div>
                </div>
            </div>

        </ons-page>
    </template>
    <template id="invalid.html">
        <ons-dialog id="invalid">
            <div style="text-align: center; padding: 10px;">
                <p>
                    Sorry ! Either emaild id or password is incorrect
                </p>
                <p>
                    <ons-button onclick="hideDialog('invalid')">Close</ons-button>
                </p>
            </div>
        </ons-dialog>
    </template>

0 个答案:

没有答案