码迷,mamicode.com
首页 > 其他好文 > 详细

提交表单而不刷新页面

时间:2020-05-12 17:02:36      阅读:50      评论:0      收藏:0      [点我收藏+]

标签:func   form   标志位   doc   attach   NPU   提交表单   flag   dom   

用Form+iFrame

<iframe id="if" class="fr" name="fr"></iframe>

<form target="fr" action="/Home/test">

    <input type="submit" class="submit" value="Start" onclick="return sub()"/>

</form>

 

<script>   

    //获取iframe对象

    var iframe = document.getElementById("if");

    var flag = 0;

    //JS绑定事件

    //el:表示选中的dom元素

    //type:事件名称

    //fn:事件处理器

    function addEvent(el, type, fn) {

        if (el.addEventListener) {

            //绝大多数非IE内核浏览器

            el.addEventListener(type, fn, false);

        } else if (el.attachEvent) {

            //IE内核

            el.attachEvent(‘on‘ + type, function () {

                fn.call(el);

            });

        } else {

            //选择dom元素错误

            throw new Error(‘不支持该dom元素‘);

        }

    }

    

    addEvent(iframe, ‘load‘, function () {        

        if (flag != 0) {

            alert("执行完毕!");

            //事件这里处理完就把flag变成0

            flag = 0;

        }

    });

 

    function sub() {

        //如果flag为0,说明是刚进来没有请求过。

        //然后把它变成1

        //说明我已经在请求了

        //通知事件那边准备处理

        if (flag == 0) {

            flag = 1;

        }

        return true;

    }

</script>

关于标志位:

也可以利用服务器返回值来判断。事件处理器中,判断iframe中是否有服务器返回值,没有说明是刚进来,没有请求过。有的话就表示是因为请求而触发的onload事件。事件处理器处理完之后,再把iframe清空。就是这样。本质上跟第一种是一样的。

提交表单而不刷新页面

标签:func   form   标志位   doc   attach   NPU   提交表单   flag   dom   

原文地址:https://www.cnblogs.com/baimeishaoxia/p/12876900.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!