Question

我的要求是双击div时，另一个div应该打开为fancybox ..如何在Jquery中使用rails 3.1

我在document.ready（）

中有以下功能

$("#a1").dblclick(function () {
  $.get("/projects/edit/"+this.id,{
  u:$('#user').val()
  },
  function(data)
  {
  $("#edit_proj").fancybox();
  $("#edit_proj").html(data);

  });

但是edit_proj div没有在fancybox中打开..我不知道如何在fancybox中打开它..

由于

Answer 1

确保页面上存在#edit_proj，同时更改此

 $("#edit_proj").fancybox();
  $("#edit_proj").html(data);

到这个

  $("#edit_proj").html(data);
 $("#edit_proj").fancybox();

Answer 2

如果您的文档结构中存在divs，则我不知道<div id="edit_proj"></div>的结构（您可以对其进行评估并将div动态追加到父容器中虽然）...所以猜测你有这个（渲染的html）结构：

<div id="a1">double click me</div>
<div id="container"></div>

...其中#container是（将是）div的父#edit_proj，然后您可以尝试使用此脚本

$("#a1").dblclick(function() {
    $.get("/projects/edit/" + this.id, {
        u: $('#user').val(),
    }, function(data) {
        if ($("#edit_proj").length == 0) {
            console.log("it doesn't exist"); // so append it
            $("<div id='edit_proj' />").appendTo("#container").html(data);
            $.fancybox("#edit_proj"); // fancybox
        } else {
            console.log("it does exist"); // so add data
            $("#edit_proj").html(data);
            $.fancybox("#edit_proj"); // fancybox
        }
    }); // get
}); // dblclick

参见 JSFIDDLE

重要：请注意，由于您使用的是inline内容，因此fancybox会将<div id='edit_proj'></div>返回到文档结构中的位置，其属性为display:none;

注意：此演示使用fancybox v2.1.3 +。

div上的fancybox双击

2 个答案: