加载网页时在右侧 div 中显示内容

Question

我正在单击“左”div 中的列表项链接，然后在网页上的“右”div 中显示一个 html 页面。我希望在第一次加载网页时加载其中一个 html 页面（即作为默认值）。我该怎么做？

另外，我怎样才能让背景颜色延伸到“右”div 的底部？我一直在创建具有自动规范的 div，如果我的“左”div 比“右”div 中的内容长，我将在底部有一个白条。

jQuery 代码：

<script type="text/javascript" id="initialLoad">
    $("#contactDetailsPane").load('listOfServices.htm');
</script>

<script type="text/javascript" id="jQueryCode">

    $(document).ready(
        function(){
            $('a.names').click(
                function(){
                    var thisId = $(this).attr('id');
                    $('#contactDetailsPane').fadeOut(400,
                    function(){
                        //$(this).load('tempPage.html #'+thisId+'Details');
                        $(this).load(thisId + '.htm');
                        var thisWidth = $(this).parents('dd').width();
                    }).fadeIn(600);

                    return false;
                }
            );
            $('.close').live('click',function(){
                $(this).parents('div').fadeOut();
            });
        }
    );
</script>

Answer 1

我能想到的最简单的 ajax 请求.. 为此包括 jquery。

$(function(){
    $.get('htmldoc.html', function(data) {
       $('#resultdiv').html(data);
    });
});

Answer 2

$(document).ready(function(){
   $("#idOfYourLink").click()
})

Answer 3

初始加载：在 document.ready 部分之前：$("#rightDiv").load('path/to/html/file.html');

背景颜色等与 css 相关：谷歌是你的朋友！

Answer 4

当你说你的右边有一个“HTML 页面”div，你的意思是你有一个全新的页面加载到iframe 中吗？还是只是一个普通的div？

要回答您的第二个问题，您可以实现here 描述的布局。

请特别注意第 6 步。

Answer 5

关于背景颜色问题：研究围绕它们创建一个包装 div 并在该 div 的 css 属性中设置所需的背景颜色。然后将左右div的背景设置为透明。

你的 html 中的前：

<div id="wrapper">
     <div id="left"></div>
     <div id="right></div>
</div>

在你的 CSS 中：

#wrapper{
   background-color:#ff0000;
}

#left, #right{
background:transparent;
}