Javascript 如何在表单提交时触发div

我是jquery的新手。。。刚开始学

我遇到的一个问题是，当我点击打开模型锚定链接时，它会触发打开模态div，并会弹出一个包含打开模态div内容的弹出窗口。。。代码如下

  <a href="#opneModal"> Open Model </a>

<div id="openModal" class="modalDialog">
   <div>
    <a href="#close" title="Close" class="close">X</a>
    <h2>Congrats..</h2>
    <p>Now you can apply discount.</p>
   </div>
</div>

    <form action="" method="POST">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

    $('form').submit(function(){
        //which code i should write which will call **OpenModal div**
    })

恭喜。。
现在你可以申请折扣了

您可以查看输出

到目前为止，一切都很顺利。但现在我想在提交表单时打开弹出窗口（触发器OpenModal div）。。。提交表单代码如下

  <a href="#opneModal"> Open Model </a>

<div id="openModal" class="modalDialog">
   <div>
    <a href="#close" title="Close" class="close">X</a>
    <h2>Congrats..</h2>
    <p>Now you can apply discount.</p>
   </div>
</div>

    <form action="" method="POST">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

    $('form').submit(function(){
        //which code i should write which will call **OpenModal div**
    })

$（'form'）。提交（函数（）{
//我应该编写哪些代码，哪些代码将调用**OpenModal div**
})

---

提前感谢

您的jquery代码应该是这样的

//then here is your code
$('form').submit(function(e){
        $('#openModal').fadeIn()
        e.preventDefault()
    })

$('form').submit( function(e) {
    $('a').trigger('click') //or open model directly
    e.preventDefault();
});

---

jquery代码应该是这样的

$('form').submit( function(e) {
    $('a').trigger('click') //or open model directly
    e.preventDefault();
});

我想您需要（当您提交表单时，

对话框将显示：

$('#send').click(function(foo){
     foo.preventDefault(); // you can remove this if you change #send type to button

     $('form').submit(function(){ // submit the form and show the dialog
        $('#mylink').click();
     })
});

我想您需要（当您提交表单时，
对话框将显示：

$('#send').click(function(foo){
     foo.preventDefault(); // you can remove this if you change #send type to button

     $('form').submit(function(){ // submit the form and show the dialog
        $('#mylink').click();
     })
});

到目前为止，一切都很好。但现在我想打开弹出窗口
提交表单时的窗口（触发OpenModel div）…提交
表格代码如下

  <a href="#opneModal"> Open Model </a>

<div id="openModal" class="modalDialog">
   <div>
    <a href="#close" title="Close" class="close">X</a>
    <h2>Congrats..</h2>
    <p>Now you can apply discount.</p>
   </div>
</div>

    <form action="" method="POST">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

    $('form').submit(function(){
        //which code i should write which will call **OpenModal div**
    })

我想你说的是一个模式对话框

我创造了，
我想我错了标题，因为很难找到它。
我使用了method GET，我不知道这是否也使用method POST，但你可以试试

现在我解释如何工作

你用这个表格和我说的看动作

<form action="" method="POST" id="forma">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

到目前为止，一切都很好。但现在我想打开弹出窗口
提交表单时的窗口（触发OpenModel div）…提交
表格代码如下

  <a href="#opneModal"> Open Model </a>

<div id="openModal" class="modalDialog">
   <div>
    <a href="#close" title="Close" class="close">X</a>
    <h2>Congrats..</h2>
    <p>Now you can apply discount.</p>
   </div>
</div>

    <form action="" method="POST">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

    $('form').submit(function(){
        //which code i should write which will call **OpenModal div**
    })

我想你说的是一个模式对话框

我创造了，
我想我错了标题，因为很难找到它。
我使用了method GET，我不知道这是否也使用method POST，但你可以试试

现在我解释如何工作

你用这个表格和我说的看动作

<form action="" method="POST" id="forma">
       <input type="text" name="name" required="" placeholder="Name" class="textbox"/>
       <input type="email" name="email" required="" placeholder="Email Address*" class="textbox"/>
      <input type="submit"  id="send" value="SUBMIT" class="button" />
    </form>

$（'.modalDialog'）.fadeIn（）；
对你有用吗？你拼写OpenModel错了。对不起，我可以收到我的答案是否有用的信息？
$（'.modalDialog'）.fadeIn（）
对你有用吗？你拼错了OpenModel。对不起，但我可以收到我的答案是否有用的信息？是的，上面的方法会有效。主要是关于e.preventDefault，它将取消默认表单提交。请看这里…锚正在工作..代替锚我想在提交表单时做同样的事情是的，以上批准ach将工作。主要是关于e.preventDefault，它将取消默认表单提交。请看这里…锚正在工作..除了锚，我想在提交表单时做同样的事情form@AdamAzad锚链接我只是为了测试…最初我想弹出窗口，而用户提交表单看到这里…锚正在工作..而不是锚我想要的要在我提交表单时执行同样的操作，请参见上面的编辑，您需要调用您的方法，该方法会弹出jquery中的div。我尝试了相同的代码，但没有工作…它直接重定向到我的表单操作页面…因此，您需要防止默认提交，添加了e.preventDefault（）遵守守则above@AdamAzad锚链接我只是为了测试而保留。最初我想在用户提交表单时弹出窗口。请看这里…锚正在工作。除了锚，我想在提交表单时做同样的事情。请看上面的编辑，你需要调用你的方法，它会弹出jquery中的div。我尝试了相同的代码，但没有工作…这太可怕了直接重定向到我的表单操作页面…所以，您需要防止默认提交，添加了e.preventDefault（）到上面的代码，它将我重定向到我的表单操作页面…它将进入sumbit函数，但它没有显示…更改
#发送
键入按钮
当我单击sumbit按钮时，什么都没有发生…你能在此处编辑你的代码吗？它将我重定向到我的表单操作页面…它将进入sumbit函数，但不是如何…更改
#发送
键入按钮
当我单击sumbit按钮时，什么都没有发生…您能在这里编辑您的代码吗