在div中加载html然后将其删除

时间:2012-12-05 17:33:34

标签: javascript jquery html load webaddress

我是Javascript的初学者,我在一段时间内遇到了问题。我想从另一个本地html文档中打开现有div中的新内容。因此,在主要内容中,我有一个简单的项目列表,当我点击一个项目时,我希望它与我的项目一样打开div'#content'。为此,我使用代码:

$(document).ready(function() {
    $('a.th-link').click(function() {
        var url = $(this).attr('href');
        $('#content').html('<h4>Loading...</h4>').load(url+ '#mynewdiv');
        $.getScript('js/jquery.js'); 
        $.getScript('js/jquery.horizontal.scroll.js'); 
        $.getScript('js/jquery.mousewheel.js'); 
        $(url).remove();
        return false;
    });
 });

问题是当我想回到我的主要div项目'#content',鼠标或浏览器上的后退按钮时,我坚持其他div'#mynewdiv' ,或者我到达之前的开放网站。 任何人都可以帮助代码吗?

我还在处理这个问题。我发现了一个类似于我的粗略示例,我已经改变了它,按照我想要的方式工作,但仍然无法正常工作。刷新我的问题。

我想在某个div中打开一个新的html页面,它会恢复按钮。

我也尝试了benalman bbq,但我无法弄清楚,我做错了什么。

这就是我正在做的事情

    <!DOCTYPE html>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>TEST</title>
    <script src="http://www.google.com/jsapi"></script>
    <script type="text/javascript">
    google.load("jquery", "1.4.1");
    </script>
    <script src="jquery.address-1.1.min.js"></script>


    <script type="text/javascript">
    /*<![CDATA[*/
    $("document").ready(function(){

        function loadURL(url) {
            console.log("loadURL: " + url);
            $("#area").load(url);
        }


        // Event handlers
        $.address.externalChange(function(event) {
console.log("init: " + $('[rel=address:' + event.value + ']').attr('href'));
$("#area").load($('[rel=address:' + event.value + ']').attr('href'));
}).change(function(event) {
console.log("change");
});

        $('a.test').click(function(){
            loadURL($(this).attr('href'));
        });

        });

    /*]]>*/
    </script>

<style type="text/css">
#area {border-style:solid;
border-width:5px;
height:300px;
width:100%;}
</style>

</head>
<body>
<p>Test</p>
    <div id="area">

    <a class='test' href="test1.html" rel="address:/test1">Test 1</a> <br />
    <a class='test' href="test2.html" rel="address:/test2">Test 2</a> <br /> <br /> <br />

</body>
</html>

感谢您的回答

1 个答案:

答案 0 :(得分:0)

.load()获取数据并将其显示在同一网站上。浏览器永远不会改变页面。因此,当您单击后退时,浏览器将转到上一个打开的站点。

您可以使用jQuery Address之类的插件来模拟您想要的行为。