的fancybox不工作

Question

這是我的形式

<form id="detail_form" class="hidden"> 
... 
</form> 

我有一個鏈接

<a href='#detail_form' class='btn fancybox detail'> Details...</a> 

這是我的腳本來處理單擊a#detail_form。它的工作原理正確

$(".detail").on('click', function() { 
    var self = $(this).parent().parent(); 
    $.ajax({ 
     type: 'post', 
     url: 'details', 
     data: { 
      id: self.children("input").attr("value") 
     } 
    }).done(function (data) { 
     if (data == "true") { 
      var a = self.children("a").children("span"); 
      a.html(parseInt(a.html()) + 1); 

     } 
    }); 
    return false; 
}); 

而且我打電話的fancybox

$(".fancybox.detail").fancybox({ 
    width: 600, 
    autoDimensions: true, 
    fitToView: false, 
    scrolling: 'no' 
}); 

當我點擊a#detail_form，我的劇本已經開始，但的fancybox不響應。

Answer 1

如果你想創建的HTML被傳遞到的fancybox然後，Refernce

你可以嘗試這樣的

$(document).ready(function() { 
    $(".detail").on('click', function() { 
     $.fancybox({ 
      'content': $("#detail_form").html() // Form as HTML Content 
     }); 
    }); 
}); 

Fiddle

或者你可以嘗試像這樣與你目前的做法

$(document).ready(function() { 
    $(".detail").fancybox({ 
     width: 600, 
     autoDimensions: true, 
     fitToView: false, 
     scrolling: 'no', 
     'content': $("#detail_form").html() //Form as HTML Content 
    }); 
}); 

Fiddle