javascript – jquery弹出效果’onclick’提交按钮(WITHDRAWN)

由于我是初学者,我有一个初学者的问题.

使用着名的fancyBox插件.在头部调用它是这样的：

$(document).ready(function() {
    $(".fancybox").fancybox();
});

通常,通过添加类名来附加脚本：

<a class="fancybox fancybox.iframe">...</a>

我目前遇到的困难是因为我想在用户提交表单后运行fancyBox弹出窗口：

<form action="http://maps.google.com/maps" method="get">
    ...(google API stuff etc, etc)...
    <input type="submit" value="...">

我对这一点的研究使我得出结论,我可能必须使用onsubmit或onclick

<input type="submit">

然而,我的实验证明是徒劳的.

任何帮助将不胜感激.

========================================

更新：(2013年1月7日)

我正在撤回我的问题,因为我显然已经徘徊在目前略高于我头脑的主题上.我选择不删除这个问题以防将来有人在这里找到一些用处.谢谢大家的帮助.

我的理由：Google导演似乎不允许在< iframe>中显示.考虑到这一点,为fancyBox配置一个变通方法太复杂了.我放弃了fancyBox,并使用普通的旧Javascript：

as shown here

解决方法:

使用$.ajax发布表单可以让您获得最大的控制权.然后,您可以从客户端控制成功和错误条件.

为此,您需要捕获提交事件：

$('#form').submit(function() {
 ajaxUpdate();
 return false;   
});

然后创建一个函数：

function ajaxUpdate(){
 var formSerial = $('#form').serialize();
 $.ajax({
        url: '<url to post to>',
        dataType: "text",
        type: "POST",
        data: formSerial,
        success: function(text) {
          $(".fancybox").fancybox();
        },
        error: function(text) {
          alert('error in posting');
        }
});
}

然后,您可以在成功和错误块中执行您喜欢的操作.

要加载窗口,您可以将以下内容添加到您的函数中：

if(confirm("Do you want to open the directions?")){
      $.fancybox({
                'titleShow': false,
                'width': 370,
                'height': 300,
                'href': <URL>,
                'type': 'iframe'
              });
}

标签：jquery,javascript,onclick,onsubmit
来源： https://codeday.me/bug/20190709/1411891.html