javascript - HTML JS 注入(inject)表单提交

标签 javascript html forms addeventlistener event-listener

我有一个应用程序,它注入(inject)一个用于提交的 html 事件监听器。我们想做一些验证,然后调用原始提交。由于某种原因,我们不断地使用以下命令在递归调用中调用“拦截器(evt)”。想法?

 // SUBMIT OVERRIDES

    HTMLFormElement.prototype._submit = HTMLFormElement.prototype.submit;
    HTMLFormElement.prototype.submit = interceptor;
    console.log("AddEventListener SUBMIT override");
    window.addEventListener('submit', function submit_el(e) {
        console.log("PK submit calling JS interceptor");
        e.preventDefault();
        interceptor(e);
    }, false);

function interceptor(evt) {
        frm = evt ? evt.target : this;
        if (!frm.onsubmit || (frm.onsubmit() !== false)) { 
            // DO SOME STUFF....
            console.log("Calling the real form submit which should not call the listener");            
            frm._submit(); //form submission
            console.log("Calling the real form submit - COMPLETED");
        }
        return false;
    }

最佳答案

您总是在取消事件,当您调用原始的 onsubmit 函数时,您还会触发事件监听器并执行与第一次相同的操作,尝试移动 e.preventDefault();之前return false;拦截器函数内部

您还可以创建一个标志来指示是否应运行原始 onsubmit 函数或是否应取消事件

关于javascript - HTML JS 注入(inject)表单提交,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55173153/

相关文章:

javascript - console.log() 显示变量值实际变化前的变化值

javascript - 当使用多个值调用时,一些 mixin 参数保持不变

html - 讲台 CSS : position elements at the bottom of their div

javascript - 如何在 HTML 中显示来自外部 JavaScript 的变量。浏览器 7

html - 将样式应用于跨度以在特定位置显示它

html - 自动完成 "Off"被完全忽略

javascript - 令人困惑的 webpack/ES6 项目设置

javascript - 如何使用 lodash 做 deep _.omitby

javascript - 为什么相同输入字段文本中的 `readonly` 、 `disabled` 和 `required` 无法正常工作?

javascript - IE11 中的表单文件输入未正确重置