0

我正在尝试使用表单来填充fancybox。本质上，我使用“get”方法将数据传递到一个 url，该 url 将填充谷歌地图数据在幻想框中。基本上，用户进入 city，然后它填充到 fancybox 中的 mysite.com/city）。我什至无法加载fancybox。

我正在使用fancybox 1.3.4

以下是我当前的代码：

<form id="form" class="form" method="get">
<label for="search">City:</label>
<input type="text" name="search" maxlength="50" size="30" />
</form>
<a class="form" data-fancybox-type="ajax" href="URL" id="datacity">Go</a>

<script>
$(document).ready(function () {
  $('.datacity').on("click", function (e) {
   e.preventDefault(); 
$.ajax({
  type: "GET",
  cache: false,
  url: this.href,
  data: $("#form").serializeArray(), // NOTE:I REALIZE IM NOT PASSING A URL PARAMENTER-- Id like it to add href.FORMDATA. and display that in an iframe (below)
  success: function (data) {
    $.fancybox(data, {
      fitToView: false,
      width: 905,
      height: 505,
      autoSize: false,
      closeClick: false,
      openEffect: 'none',
      closeEffect: 'none'
    }); 
     } 
   }); 
 }); 
  }); 
</script>
4

2 回答 2

0

用更简单的解决方案解决了问题——无需将表单转换为 ajax

$(function() {

$("#form").submit(function() {

    $form = $(this);

    $.fancybox({
            'href': $form.attr("action") + "?" + $form.serialize(),
            'type': 'iframe'
    });

    return false;

});


});
于 2013-10-08T14:06:06.367 回答
0

鉴于您的示例代码，我相信您应该选择datacityID 而不是 CLASS。

在其当前形式中，jQuery 选择失败，并执行默认行为<a href>而不是您的 jQuery 代码。

要选择这个：

<a class="form" data-fancybox-type="ajax" href="URL" id="datacity">Go</a>

用这个：

$('#datacity').on("click", function (e) {

而不是这个：

$('.datacity').on("click", function (e) {
于 2013-10-07T23:12:53.073 回答