0

I'm a beginner in Javascript and I struggle with a problem for a while. I want to open a new content in an existing div from another local html document. So in main content I have a simple list of projects and when I click on one project I want it to open in same the div '#content' as my projects. For this I use code:

$(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;
    });
 });

The problem is when I want to go back to my main div with projects '#content', with back-button on mouse or with browser, I stuck on other div '#mynewdiv', or I get to the previous open site. Can anybody help with the code?

I'm still dealing with this problem. I found a rough example that is similar to mine and I have transformed it, to work like I want, but still doesn't work as it should. To refresh my problem.

I want to open in certain div, a new html page and it will work back button.

I also tried benalman bbq but I can't figure out, what I'm doing wrong.

Here is what I'm doing

    <!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>

Thanks for the answer

4

1 回答 1

0

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

您可以使用像jQuery Address这样的插件来模拟您想要的行为。

于 2012-12-05T17:43:55.423 回答