php 如何使用jquery或javascript在php中打开表单提交的弹出窗口

how to open popup on form submit in php using jquery or javascript

提问by MAR

I am trying to open a popup on submit button of a contact form below is the code

我正在尝试在下面的联系表单的提交按钮上打开一个弹出窗口是代码

<form id="contact" name="contact" method="post" action="mail2.php" onsubmit="return valid();">
            <label>Name :</label>
                <input name="name" type="text" id="name" class="contact-input-box" />

            <label>Contact No. :</label>
                <input name="telephone" type="text" id="telephone" class="contact-input-box" />

            <label>Email :</label>
                <input name="email" type="text" id="email" class="contact-input-box" /><br class="clearBoth" />  

            <label>Gender :</label>
            <span>Mail</span> <input type="radio" name="gender" value="male">
            <span>Femail</span> <input type="radio" name="gender" value="female" /> <br class="clearBoth" />

            <label>product :</label>
            <select name="product" class="dropdown" id="product">
                      <option>Product</option>
                      <option value="cd">CD</option>
                      <option value="dvd">DVD</option>
            </select> <br class="clearBoth" />

            <label>Comment :</label>
                <textarea name="comment"  id="comment" class="contact-input-box1"></textarea><br class="clearBoth" />
                <p id="button1"></p>

            <label>&nbsp;</label>
                <input name="button" type="submit" id="button" title="Submit" value="Submit" onclick="myFunction()" /> 
        </form>

but I am unable to open the popup. form is working fine. currently it is went on thankyou.html page. I need to open the thank you message in popup box.

但我无法打开弹出窗口。表单工作正常。目前它是在thankyou.html 页面上进行的。我需要在弹出框中打开感谢信息。

回答by Richard de Wit

If you mean a javascript popup, use alert("message");in your myFunction().

如果您的意思是 javascript 弹出窗口，请alert("message");在您的myFunction().

If you mean a new window/tab, put this in your form target="_blank"so it reads like this:

如果你的意思是一个新的窗口/标签，把它放在你的表单中，target="_blank"这样它就读起来了：

<form id="contact" name="contact" method="post" action="mail2.php" target="_blank" onsubmit="return valid();">

---

---

Also you're doing 2 separate things when submitting your form:

此外，您在提交表单时会做两件不同的事情：

• Your form has onsubmit="return valid();"
• Your submitbutton has onclick="myFunction();"

• 你的表格有 onsubmit="return valid();"
• 你的submit按钮有onclick="myFunction();"

You should put the validation and the contents of the myFunction()function in a submit-function like this:

您应该将验证和myFunction()函数的内容放在一个submit-function 中，如下所示：

$("#contact").on("submit", function()
{
    alert("Testmessage");

    // Validation
    // if validation fails:
        return false;

    // Then whatever you do in `myFunction();`
});

回答by Sandeep.sarkar

You can use jquery ui dialog. For that make a div in your html and put the content inside the div that you want to show in popup.

您可以使用 jquery ui 对话框。为此，在您的 html 中创建一个 div 并将内容放在要在弹出窗口中显示的 div 中。

<div id="my-popup-div"> this content will be shown inside popup </div>

now use jquery dialog initiator.

现在使用 jquery 对话框启动器。

$(document).ready(function(){    
        $("#my-popup-div").dialog({});
    }) 

now in your function

现在在你的功能中

function myFunction()
{
   $("#my-popup-div").dialog("open");
}

for more customization follow ui tutorials jquery ui dialog

如需更多定制，请关注 ui 教程jquery ui 对话框

回答by Leonardo Thizon

Try the JqueryUi Dialog. This way you can show de thankyou.html in a customizable pop up.

试试 JqueryUi 对话框。通过这种方式，您可以在可自定义的弹出窗口中显示 deThankyou.html。

It's a easy way to solve your problem.

这是解决您问题的简单方法。

回答by asim-ishaq

If you want a popup to ask the user whether to submit the form or not then you can hook into form onsumbit event:

如果您想要一个弹出窗口询问用户是否提交表单，那么您可以挂钩表单 onsumbit 事件：

function beforeSubmit() {
    if (confirm("Are you sure, you want to submit form?")) {
        return true;
    } 
    return false;
}

EXAMPLE DEMO

示例演示

回答by Suresh Atta

try

尝试

  $('#button').submit(function() {
      alert('Handler for .submit() called.'); //you can call myFunction()  here
      return false  //will stop the form submission.

    });

If you don't want to stop the form submission there will be no need to show any alerts,because the page already submitted.

如果您不想停止表单提交，则无需显示任何警报，因为页面已经提交。

Or you can try setTimeoutfor sometime to show popup of thankyou and then submit the form

或者您可以尝试setTimeout显示感谢您的弹出窗口，然后提交表单