通过Java脚本加载视图

时间:2019-01-22 09:25:22

标签: javascript html

我有一个主要的html页面(index.html)

<body>

            <script type="text/javascript">
                function active(el) {
                    var sections = document.querySelectorAll('.sidebar>li');
                    for (i = 0; i < sections.length; i++) {
                        sections[i].classList.remove('current');
                    }
                    el.classList.add('current');
                }
            </script>
            <h1 onclick="active(this); load('content','pages/home.html')" class="sidebar-title">GOSSAMER LAN</h1>
            <ul class="sidebar">
                <li onclick="active(this); load('content','pages/network.html')">
                    <h2>Network settings</h2>
                    <small>Edit configuration</small>
                </li>
            </ul>
        </section>
        <section id="content"></section>
    </section>

    <script type="text/javascript" src="js/main.js"></script>


</body>

和具有按钮的网络设置视图(network.html)

 <div class="save-button" onclick="validation();">Save changes</div>

我要做的是单击按钮以返回查看(home.html)

function validation() {
    var inputs = document.querySelectorAll('input[type=text],input[type=password]');
    var input = [];
    for (p = 0; p < inputs.length; p++) {
        input.push(inputs[p].value);

        if (!inputs[p].parentNode.classList.contains("deactive")) {
            inputs[p].value == "" ? inputs[p].classList.add("error") : inputs[p].classList.remove("error")
        }
    }
    if (input.indexOf("") == -1) {
        sendData();
        load("content","pages/home.html");

    }

通过我的Java脚本代码

function load(page,src) {
    console.log( document.getElementById(page));
    document.getElementById(page).innerHTML='<object type="text/html" id="dynamic-'+page+'" data="'+src+'" style="width:100%; height: 100%;" ></object>';

}
load("content","pages/home.html");

我已经将我的大部分代码做了一些详细说明,以实现我希望实现的目标,即在执行onclick函数(验证)时无法设置null的'innerHTML'属性

请帮忙吗? 谢谢

0 个答案:

没有答案