我正在使用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>
答案 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>
点击链接后,网址将从
更改到
并且在新网址中找不到这两个 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>