使い方jqueryの.htmlを（）fancyboxコンテンツ

Question

ため

私のファイル：

<script type="text/javascript" src="{{ STATIC_URL }}js/jquery.fancybox-1.3.4.pack.js"></script> 

<link rel="stylesheet" href="{{ STATIC_URL }}css/jquery.fancybox-1.3.4.css" type="text/css" media="screen" /> 

{% include "submission-form.html" with section="photos" %} 
<div class="commentables"> 
    {% load thumbnail %} 

    {% for story in objects %} 
     <div class="image {% if forloop.counter|add:"-1"|divisibleby:picsinrow %}left{% else %}{% if forloop.counter|divisibleby:picsinrow %}right{% else %}middle{% endif %}{% endif %}"> 
      {% if story.image %} 
       {% thumbnail story.image size crop="center" as full_im %} 
        <a rel="gallery" href="{% url post slug=story.slug %}"> 
         <img class="preview" {% if story.title %} alt="{{ story.title }}" {% endif %} src="{{ full_im.url }}"> 
        </a> 
       {% endthumbnail %} 
      {% else %} 
       {% if story.image_url %} 
        {% thumbnail story.image_url size crop="center" as full_im %} 
         <a rel="gallery" href="{% url post slug=story.slug %}"> 
          <img class="preview" {% if story.title %} alt="{{ story.title }}" {% endif %} src="{{ full_im.url }}"> 
         </a> 
        {% endthumbnail %} 
       {% endif %} 
      {% endif %} 

     </div> 

</div> 

<script> 
    $(document).ready(function(){ 
     $(".image a").click(function(){ 
      alert($(this).parent().html()); 
     }); 

     $(".image a").fancybox({ 
      title: $(this).attr("alt"), 
      content: $(this).parent().html() 
     }); 
    }); 
</script> 

問題があり、fancyboxはアンカーのhrefのHTMLをロードしている、いない適切に警告し、私はコンテンツのために渡すHTML、。

どうしたのですか？

Answer 1

残念ながら、あなたがそうfancybox（v1.3.x）関数（これは設計上の問題だ）内部が、他のjQueryのメソッド内$(this)を使用することはできませんこの

$(document).ready(function(){ 
$(".image a").bind("click",function(){ 
    var data = $(this).parent().html(); 
    var dataTitle = $(this).attr("alt"); 
    function newTitle(){return "<span>"+dataTitle+"</span>";} 
    $.fancybox(data,{ 
    "titlePosition": "inside", 
    "titleFormat": newTitle 
    }); // fancybox 
    return false; 
}); // bind 
}); //ready 

Answer 2

私はこの1つがうまくいくと思う：

$(".image a").click(function(){ 
     $.fancybox($(this).parent().html(),{ 
      title: $(this).attr("alt") 
     }); 
    });