javascript - jQuery SlideToggle 不起作用

Question

我的 JavaScript:

$("#preview-click").click( function() {
    $("#preview").slideToggle("fast", function() {
        $("#preview-pdf").html('<iframe style="width: 100%; height: 500px;" src="http://docs.google.com/gview?url=http://www.example.com/pdf/3.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>');
    });
}); 

我的 HTML:

<a id="preview-click" style="cursor: pointer;">preview</a>
<div id="preview" class="generic-block-70" style="display: none">
    <div id="preview-pdf" class="generic-content-70">
    </div>
</div>

我试图让 div 向下滑动，然后更改它的内容。如果 iframe 已经在 div 中，并且我只是进行滑移切换，则该框架无法正确渲染 - 这就是为什么我需要在 div 可见后才生成内容。

上面的解决方案根本不起作用。当我点击链接时没有任何反应。

我还应该注意，我有多个 $(document).ready()

Answer 1

这在我的 js fiddle 上运行良好，您正在使用文档吗 http://jsfiddle.net/CyCC3/

$(document).ready(function() {

$("#preview-click").click( function() {
    $("#preview").slideToggle("fast", function() {
        $("#preview-pdf").html('<iframe style="width: 100%; height: 500px;" src="http://docs.google.com/gview?url=http://www.example.com/pdf/3.pdf&embedded=true" style="width:718px; height:700px;" frameborder="0"></iframe>');
    });
}); 

});