Question

我有这个脚本：

<form action="" method="POST" id="regform">
    <paper-material id="general">
            <gold-email-input pw="mail" name="mail" label="Mail" auto-validate></gold-email-input>
            <paper-input id="pw" name="pw" type="password" label="Password"></paper-input>
            <paper-input id="pwrepeat" type="password" label="Repeat password"></paper-input>

            <paper-button onClick="subform();" id="submitbutton" elevation="2" raised>Submit</paper-button>
    </paper-material>
</form>

function subform(){
        console.log("call");
        $('#regform').submit(function(e){
            console.log( "Data: " + $(this).serialize() );
            e.preventDefault(); //no difference with or without this function               
        });
    }

脚本不调用方法submit(function(e))。为什么？我想阻止提交和使用数据。这是从表单中分离数据的正确方法吗？

Answer 1

正如你的代码所代表的那样，函数可能会被调用，具体取决于你的javascript代码的位置。

一般情况下，不鼓励使用onClick，因为它可能会导致令人讨厌的范围问题。此时，html解析器使用onclick="subform();"到达您的输入，此函数必须注册到全局范围。如果您使用$(document).ready或在页面底部使用javascript，则不的情况。

因此，请检查您的控制台是否有错误，因为您应该看到console.log("call");或错误消息，这会阻止您首先执行您的功能。

此外，在onClick处理程序中，您只是为submit事件注册一个处理程序，因此您也可以完全跳过这个并简单地直接注册提交处理程序。

您的代码应该如下所示：

// this waits until your form is submitted $('#regform').submit(function(e){ console.log("submit button was pressed"); console.log( "Data: " + $(this).serialize() ); // this prevents the the actual form submit, so you have to do // some kind of ajax call, to get the data to the server e.preventDefault(); });

Answer 2

尝试将提交按钮指定为输入类型。

<input type="submit" class="paper-button" onClick="subform();" id="submitbutton" elevation="2" raised>Submit</paper-button>

此外，preventdefault将阻止提交。尝试删除它。

修改

正如克里斯托弗指出的那样，正在使用一个图书馆，因此选项一不会起作用。请改为删除preventdefault。

JQuery submit（）不起作用

2 个答案: