jQuery slideToggle not working

本文关键字：working not slideToggle jQuery 更新时间：2023-09-26

我的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()

这在我的js小提琴上很好，这里你使用文档准备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>');
    });
}); 
});

$("#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>');
    });
    return false; 
});

$("#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>');
    });
    return FALSE;
});

在我的情况下，Slidetoggle在我的iframe部分工作，但它留下了空白，我仍然找到如何解决这个问题的答案

我JS

    $(document.myform).ready(function() {
       $('div.demo:eq(0)> div#headerview').click(function() {
       $(this).next().slideToggle('20');
    });
  });

我Html

<div class="demo">
<div id="headerview" style="cursor:pointer;">SlideStarts</div>
     <table>
        <tr>
            <td></td>
        </tr>
     </table>
</div>

我试着在上下滑动时改变iframe的高度，但仍然看起来很愚蠢。