如何在html表单提交中打开jQuery模态窗口

我使用简单的html表单将产品从我的网站提交到远程托管的Mal电子商务购物车。我需要在提交表单时打开一个模式窗口（包含一个iframe）。我无法访问购物车的服务器端编程，那么有没有办法使用onclick html event属性启动jQuery模式窗口？如何在html表单提交中打开jQuery模态窗口

现在，窗体底部的onclick属性会打开一个js浏览器警报......基本上我需要用我的jQuery模式对话窗口替换这个js警报。

任何人都可以帮忙吗？

这里是我的形式是：

<form action="http://ww7.aitsafe.com/cf/add.cfm" method="post"> 
<input type="hidden" name="userid" value="96309001"> 
<input type="hidden" name="nocart"> 
<input type="hidden" name="producturl" value="http://www.fruitfulfarm.net/cart_2.html"> 
<input type="hidden" name="product" value="Test Product"> 
<input type="hidden" name="price" value="49.99"> 
<input type="hidden" name="return" 
value="www.fruitfulfarm.net/cart_2.html"> 
<input class="rounded" type="submit" name="submit" value="Add To Cart" 
onclick="alert('Order has been added to your cart\n\nThis page will refresh');" 
onkeypress="alert('Order has been added to your cart\n\nThis page will refresh');"> 
</form>

来源

2013-01-05 AaronH

您是否使用jQuery UI对于对话框？ – Ohgodwhy

如何使用表单标签的onsubmit？ – jtheman

使用onsubmit

HTML

<form method="post" action="" onsubmit="return myModal(this)"> 
    <!-- more inputs --> 
    <input type="submit" value="Submit" /> 
</form>

function myModal(f) 
{ 
    var form=f, 
     modal=$('<div/>', { 
      'id':'alert', 
      'html':'<iframe src="url"></iframe>' 
     }) 
     .dialog({ 
      'title':'Iframe in a modal window', 
      'modal':true, 
      'width':350, 
      'height':'auto', 
      'buttons': { 
       'OK': function() { 
        $(this).dialog("close"); 
        // do something, maybe call form.submit(); 
       } 
      } 
    }); 
    return false; 
}

Example

来源

2013-01-05 21:52:42

我该如何引用你给onsubmit标签的JS函数？我只要简单地将JS上传到一个文件中，并将URL放到标记中？ – AaronH

您可以将该功能保留在用'script'标签包裹的head标签中。 –

对不起，我还是不明白......我有一段代码中的HTML表单，我不知道如何处理JS，以及如何将函数引用到onsubmit标记。感谢您的帮助。 – AaronH

如何在html表单提交中打开jQuery模态窗口

回答

相关问题