Jquery“地址”无法刷新

时间:2012-12-24 04:17:20

标签: jquery jquery-plugins

我正在使用jQuery地址,我无法在刷新时初始化...(在IE以外的所有主流浏览器中)以下是问题......

当我点击一个链接时,ajax会加载它完美加载并将“selected”类添加到链接中。当我使用后退按钮时它也很完美,但是在我点击链接然后点击刷新按钮后,它会重新加载原始状态(减去ajax)并且不会将“选定”类添加到任何链接或之后再加载ajax

以下是该页面的链接。 http://www.weightlossexp.com/articles

非常感谢任何帮助,提前谢谢。

[编辑]代码

Jquery的

var init = true, 
        state = window.history.pushState !== undefined;
        // Handles response
        var handler = function(data,topic,w) {
          $("#title_back h1").hide().html(topic).fadeIn(800);
          $('title').html(topic);
          $('#content').html(data).animate({width:w},1500);
          $('#lc').show();
          // $.address.title(/>([^<]*)<\/title/.exec(data)[1]);
        };
        $.address.state('/articles').init(function() {
            // Initializes the plugin
            $('#lc a').address();                
        }).change(function(event) {
            // Selects the proper navigation link
            $('#lc a').each(function() {
                //alert($(this).attr('href')+' - - '+$.address.state() + event.path);
                if ($(this).attr('href') == ($.address.state() + event.path)) {
                    $(this).addClass('selected').focus();
                } else {
                    $(this).removeClass('selected');
                }
            });
            var classL = $(".selected").length;
            if(classL == 1){
                var topic = $('.selected h2').html();
                var action = event.path.substr(1);
                var width = '100%';
            }else{ 
                var topic = "Topics"; 
                var action = '';
                var width = '0px';
            }
            if (state && init) {
                init = false;
            } else {
                // Loads the page content and inserts it into the content area
                $.ajax({
                    url: "scripts/ajax/getSubTitles.php",
                    data: {action:action},
                    type: "post",
                    success: function(data, textStatus, XMLHttpRequest) {
                        handler(data,topic,width);
                    }
                });
            }
        });

HTML

<div id="lc" style="position:absolute; overflow:hidden;">
                    <a href="/articles/ap" id="ap"><div class="topics" style="border-top:1px solid #d1d1d1; margin-top:20px;"><h2>Anatomy and Physiology</h2></div></a>
                    <a href="/articles/end" id="end"><div class="topics"><h2>Endurance</h2></div></a>
                    <a href="/articles/flex" id="flex"><div class="topics"><h2>Flexibility</h2></div></a>
                    <a href="/articles/myth" id="myth"><div class="topics"><h2>Myths</h2></div></a>
                    <a href="/articles/nut" id="nut"><div class="topics"><h2>Nutrition 101</h2></div></a>
                    <a href="/articles/corr" id="corr"><div class="topics"><h2>Post-Rehab/Corrective Exercise</h2></div></a>
                    <a href="/articles/power" id="power"><div class="topics"><h2>Power</h2></div></a>
                    <a href="/articles/stab" id="stab"><div class="topics"><h2>Stability</h2></div></a>
                    <a href="/articles/str" id="str"><div class="topics"><h2>Strength/Resistance Training</h2></div></a>
                    <a href="/articles/supp" id="supp"><div class="topics"><h2>Supplements</h2></div></a>
                    <a href="/articles/wg" id="wg"><div class="topics"><h2>Weight Gain</h2></div></a>
                    <a href="/articles/wl" id="wl"><div class="topics"><h2>Weight Loss</h2></div></a>
                <div id="content">
                </div>

1 个答案:

答案 0 :(得分:1)

你的代码的问题在于你已经包含了javascripts的行

<script type="text/javascript" src="lib/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="lib/jquery.address-1.5.min.js"></script>

点击链接后,网址将从

更改
  

http://www.weightlossexp.com/articles

  

http://www.weightlossexp.com/articles/something

并且在新网址中找不到这两个 js 文件,因此不会加载jquery和jquery.address。

只需使用斜杠'/'启动JS文件的路径,您的代码就可以正常工作。

所以代码将是这样的:

<script type="text/javascript" src="/lib/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="/lib/jquery.address-1.5.min.js"></script>