0

このコードはFirefoxとIEで正常に機能します。Chromeでは、各リンクを2回クリックする必要がありますが、それでもページが2回読み込まれます。http://www.crowdfundcenter.com/ajaxpage.phpに例があり、これは次のコードです。

<script type="text/javascript">

$(document).ready(function () { <!-- Begin document ready function -->

    $.history.init(pageload);   

    $('a[href=' + window.location.hash + ']').addClass('selected');

    $('a[rel=ajax]').click(function () {    <!-- Begin click function -->

        var hash = this.href;
        hash = hash.replace(/^.*#/, '');
        $.history.load(hash);   

        $('a[rel=ajax]').removeClass('selected');
        $(this).addClass('selected');

        return false;

    }); <!-- End click function -->


}); <!-- End document ready function -->


function pageload(hash) {   <!-- Begin pageload hash -->
    if (hash) getPage();    
    }   <!-- End pageload hash -->


function getPage() {    <!-- Begin getPage function -->
    var loading = $("#loading");
    var data1 = document.location.hash;
    showLoading();
    switch(data1){
        case "#home":
            $('#content').slideUp();
            $('#content').load('xhome.html', hideLoading);
            $('#content').slideDown();
            break;
        case "#business":
            $('#content').slideUp();
            $('#content').load('xbusiness.html', hideLoading);
            $('#content').slideDown();
            break;
        case "#aboutus":
            $('#content').slideUp();
            $('#content').load('xaboutus.html', hideLoading);
            $('#content').slideDown();
            break;
        case "#hidpage":
            $('#content').slideUp();
            $('#content').load('xhidpage.html', hideLoading);
            $('#content').slideDown();
            break;
        default:
            $('.loading').hide();
            break;
    }

function showLoading(){
    loading
        .css({visibility:"visible"})
        .css({opacity:"1"})
        .css({display:"block"});  
        }

function hideLoading(){
    loading.fadeTo(1000, 0);
    };

};      <!-- End getPage function -->

</script>


<div id="wrapper">  <!-- Begin wrapper -->

<div id="header">
    <ul id="menu">
        <li><a href="#home" rel="ajax">Home</a></li> 
        <li><a href="#business" rel="ajax">Business</a></li> 
        <li><a href="#aboutus" rel="ajax">About Us</a></li>
    </ul>
</div>

    <div style="clear: both;"></div>

    <div style="display: block; float: left; height: 24px;">
    <div id="loading">
    <img src="img/loading99small.gif" alt="Loading..." />
    </div>
    </div>


    <div style="clear: both;"></div>


    <div id="content">  <!-- Begin content -->
        <!-- Ajax Content -->

<div style="display: block; width: auto; margin: auto;">

<div style="display: block; width: auto; margin: 0px 0px 0px 0px; color: #CCCCCC; font-size: 12px;">
    <h2>Home Page</h2>
    This is the home page generated by code on this page.
</div>
    </div>


</div>  <!-- End content -->


<div style="display: block; float: left; clear: both;"></div>


<div style="display: block; width: auto; margin: auto;">  <!-- Begin footer -->

<div id="footer" style="display: block; margin: 40px 0px 40px 0px; color: #808080; font-size: 16px; font-weight: bold;">
    This is the footer for the page.
    </div>

    </div>  <!-- End footer -->

</div>  <!-- End wrapper -->

FirefoxとIEではすべてが正常に機能します。問題はChromeであり、問​​題が何であるかわからないので、どんな支援も大歓迎です。

4

1 に答える 1

0

問題はすべてあなたのものです。

両方でページロードを発行しています

  • $('a[rel=ajax]').click()、 と
  • $.history.init()。

したがって、コードは実際には意図したとおりに機能しています。

于 2012-07-15T22:00:02.800 に答える