jQuery UI 选项卡 - 由 ajax 加载的内容不会滚动

Question

在 INDEX.PHP 中 我的选项卡声明为：

$(function() {
            $( "#tabs" ).tabs({
                load: function(event, ui) {
                    console.log("load event ran");
                    $('a', ui.panel).live("click", function() {
                           $(ui.panel).load(this.href);
                           return false;
                           });
                   }

           });

        });

我有喜欢外部 php 文件的选项卡来加载内容：

<div id="tabs">
            <ul>
              <li><a href="content.php?div=Production">Production</a></li>
              <li><a href="content.php?div=Digital">Digital</a></li>
            </ul>
        </div>

这些页面上的表单由 ajax 提交：

$(document).ready(function(){
        $("#Search_form").validate({
            debug: false,
            submitHandler: function(form) {
                $.post('search_db.php', $("#Search_form").serialize(), function(data) {
                    $('p.results').fadeIn();  
                    $('#results').html(data);
                });
            }
        });
    });

结果显示在选项卡中，但浏览器不会创建垂直滚动条来查看没有的内容不适合浏览器窗口。

我知道这是与彼此内部的多个 ajax 函数有关，我如何强制浏览器检查页面内容并创建滚动条？

PS 我对 jQuery 和 DOM 功能只有一般了解......

Answer 1

尝试将其添加到您的 css

.ui-tabs-panel {
     overflow:auto;
}

ps 中。听起来你的问题只与样式表/样式有关，与 jquery/脚本无关