Question

我的第一篇帖子@stackoverflow。请耐心等待。

请看下面的代码。我希望javascript发布到PHP（applybeta.php）文档，如果有一个＆＃39; @＆＃39;在该领域的名称＆amp; id＆＃39; epost＆＃39;。如果没有＆＃39; @＆＃39;在该字段中，将弹出一个消息框，告诉用户他们输入了无效的电子邮件地址。

如果你没有输入＆＃39; @＆＃39;消息框出现。但是如果你确实输入了一封有效的电子邮件，它就不会发布到＆＃34; applybeta.php＆＃34;，根本就没有任何事情发生。有人知道为什么？对不起，如果描述含糊不清，希望你能弄明白我的意思:)。

e-post字段既有id也有名字，因为我试过两者都没有，但都没有。

<!DOCTYPE html>
<html>
    <head>
        <title>Binärklocka</title>
        <meta charset="utf-8" />
        <link rel="stylesheet" type="text/css" href="index.css">
        <link href='http://fonts.googleapis.com/css?family=PT+Mono' rel='stylesheet' type='text/css'>
        <!-- table font --> <link href='http://fonts.googleapis.com/css?family=Lato:900italic' rel='stylesheet' type='text/css'>
    </head>
    <body>
        <script>
        function kollaepost() {
            var x = document.getElementById("email");

            if(x.value.indexOf('@') === -1) {
                alert("You didn't enter a valid E-mail address!");
            }
            else {
                document.getElementById("minForm");
                //z.submit();
                //alert("hej");
            }
         }
        </script>
        <div id="wrap">
            <div id="main">
                <br>
                <br>
                    <table id="nav">
                          <tr>
                            <td><a href="store.html">Store</a></td>
                            <td><a href="ourproducts.html">Our Products</a></td>
                            <td><a href="index.html"><img src="home.png" alt="hem" width="60" height="60"/></a></td>
                            <td><a href="aboutus.html">About Us</a></td>
                            <td><a href="contact.html">Contact</a></td>
                          </tr>
                    </table> 
                <hr id="linje1" />
            </div>
        </div>
        <p id="binaryclock"  onclick="showLink()">
            We are looking for beta testers for our newly created clock!<br />
            To participate, fill in the forms below with your real name</br />
            and a valid e-mail address and a download link will appear.
        </p>

            <!-- Form that I want to post -->
        <div id="applybeta">
            <form action="apply.php" method="post" id="minForm" name="minForm">
                <input type="text" placeholder="Full name" name="name" /><br />
                <!-- checking this field for '@' -->
                 <input type="text" placeholder="E-mail" id="email" /><br /><br />
                <!-- end of field -->
                <input onclick="kollaepost()" type="button" name="submit" value="Send" /><br />
            </form>
        </div>
            <!-- End of the form -->
        <div id="dlink">
            shdgfgh<a href="http://www.google.se">Click here to download</a>
        </div>
        <div id="bottomtext">
            <p>@ 2015 ClockMasters Elite</p>
        </div>
    </body>
</html>

Answer 1

尝试button，而不是输入submit类型的输入。然后，您的onclick-function可以通过返回true或false作为验证函数，从而影响是否提交表单。像这样：

<input onclick="return kollaepost()" type="submit" name="submit" value="Send" />

和

<script>
function kollaepost() {
    var x = document.getElementById("email");

    if(x.value.indexOf('@') === -1) {
        alert("You didn't enter a valid E-mail address!");
        return false;
    }
    return true;
}
</script>

另请参阅this question以获取有关此方法的更详细说明。

Answer 2

您可以使用.submit()方法提交表单。

var fromElement = document.getElementById("minForm"); formElement.submit();

有关详细信息，请参阅：https://developer.mozilla.org/en-US/docs/Web/API/HTMLFormElement/submit

使用<form>和POST </form>发布到单独的文档

2 个答案: