表单提交 - 同时打开新标签

Question

我的网站上有一个联系表。我正在使用我一直在编辑和配置的免费引导模板，因为我对编码了解不多。

我希望在用户点击提交按钮时打开一个新选项卡并转到特定网站（因此既提交表单，又将它们带到新网页）。我该怎么做？

<form name="sentMessage" id="contactForm" target="blank" novalidate>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <input type="text" class="form-control" placeholder="Your Name *" id="name" required data-validation-required-message="Please enter your name.">
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="form-group">
                                <input type="email" class="form-control" placeholder="Your Email *" id="email" required data-validation-required-message="Please enter your email address.">
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="form-group">
                                <input type="tel" class="form-control" placeholder="Your Phone *" id="phone" required data-validation-required-message="Please enter your phone number.">
                                <p class="help-block text-danger"></p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <textarea class="form-control" placeholder="Your Message *" id="message" required data-validation-required-message="Please enter a message."></textarea>
                                <p class="help-block text-danger"></p>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <br><br>
                        <div class="col-lg-12 text-center">
                            <div id="success"></div>
                            <button type="submit" class="btn btn-xl">Send Message</button>
                        </div>
                    </div>
                </form>

Answer 1

请像这样使用javascript。 然后会按照你说的打开新标签

function func1(){
  window.open('https://google.com', '_blank');

}

<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<form name="sentMessage" id="contactForm" onsubmit="func1()" novalidate>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="form-group">
                                <input type="text" class="form-control" placeholder="Your Name *" id="name" required data-validation-required-message="Please enter your name.">
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="form-group">
                                <input type="email" class="form-control" placeholder="Your Email *" id="email" required data-validation-required-message="Please enter your email address.">
                                <p class="help-block text-danger"></p>
                            </div>
                            <div class="form-group">
                                <input type="tel" class="form-control" placeholder="Your Phone *" id="phone" required data-validation-required-message="Please enter your phone number.">
                                <p class="help-block text-danger"></p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="form-group">
                                <textarea class="form-control" placeholder="Your Message *" id="message" required data-validation-required-message="Please enter a message."></textarea>
                                <p class="help-block text-danger"></p>
                            </div>
                        </div>
                        <div class="clearfix"></div>
                        <br><br>
                        <div class="col-lg-12 text-center">
                            <div id="success"></div>
                            <button type="submit" class="btn btn-xl">Send Message</button>
                        </div>
                    </div>
                </form>

您还可以将动作属性添加到表单标签。 然后，如果您单击该按钮，则将根据您的请求打开新选项卡，然后将请求发送到您在操作属性中指定的文件。 如果您的目的只是打开新标签，不需要提交表单，那么请添加

return false

在我的代码中 func1 函数的末尾

Answer 2

您只需要添加

action="/newpage.php" method="post"

所以在你的例子中，它看起来像：

<form name="sentMessage" id="contactForm" action="/newpage.php" method="post"  novalidate>

希望对您有所帮助...注意 /newpage 是处理您的 POST 请求的页面（无论它在哪里）。