sun*_*nki 5 jquery ruby-on-rails hashchange jquery-bbq
我在分页链接上使用Ben Almans的jQuery BBQ和jQuery hashchange插件.两者都在Opera和Firefox中按预期工作,但在IE 8中没有(令人惊讶,是吧?).IE也适用于ajax,后退按钮和hashchange,但是当我单击重新加载按钮并显示原始ajax响应而不是在先前加载的页面中运行它时失败.
所以这是我的丑陋代码和我试图在我的分页中实现的功能的一些解释:
1)搜索引擎友好链接(服务器根据客户端的javascript可用性响应html或js).
2)打开JS时使用动态可更改的URL(使用"#"符号).
3)历史和后退按钮支持.
4)最小化双重请求(如果使用html页面加载相同内容,则不要发出ajax请求).
JS:
$(function ($) {
if (ajax_init) {
$('.pagination a').live("click", function () {
$.bbq.pushState({page: $.deparam.querystring($(this).attr('href')).page});
return false;
});
$(window).bind("hashchange", function(e) {
var anchor = $.deparam.fragment().page;
var query = $.deparam.querystring().page;
if (ajax_load(anchor, query)) {
$(ajax_div).css('opacity', '0.4');
$(ajax_div + '-processing').removeClass('hidden');
$.ajax({
type: 'GET',
url: $.param.querystring('', {page: anchor}),
dataType: 'script',
cache: false
});
}
});
$(window).trigger('hashchange');
}
});
function ajax_load(anchor, query) {
if ((anchor && anchor !== query && !(!query && anchor == 1)) || $('#noscript').length < 1) {
return true;
}
else {
return false;
}
}
Run Code Online (Sandbox Code Playgroud)
模板(Rails视图):
<div id="products-container" >
<div id="products-processing" class="hidden">
<%= image_tag "spinner.gif" %>
</div>
<div id="products">
<div id="noscript">
<%= render "products_list.erb" %>
</div>
<script type="text/javascript">
var ajax_init = true;
var ajax_div = '#products';
var anchor = $.deparam.fragment().page;
var query = $.deparam.querystring().page;
if (!ajax_load(anchor, query)) {
url = anchor ? anchor : (query ? query : 1);
$.bbq.pushState({page: url});
}
else {
$('#noscript').hide();
$('#products-processing').removeClass('hidden');
}
</script>
</div>
<div id="products-min-height"></div>
</div>
Run Code Online (Sandbox Code Playgroud)
AJAX模板(Rails js视图):
$('#products').html('<%= escape_javascript(render "products_list") %>').css('opacity', '1');
Run Code Online (Sandbox Code Playgroud)
UPD: IE在刷新时不会发送请求类型标头(或Rails无法确定).所以Rails生成JS视图而不是HTML.解决方法:
respond_to do |format|
request.format.js? ? (format.js {render :index}) : (format.html {render :index})
end
Run Code Online (Sandbox Code Playgroud)
有更好的解决方案吗?
IE似乎在刷新时要求"*/*",而rails似乎认为javascript是比html更好的响应.因为刷新应该只发生在html上,告诉rails"*/*"表示html修复了这个问题:
before_filter :set_request_type
...
protected
def set_request_type
request.format = :html if request.format == "*/*"
end
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
1187 次 |
| 最近记录: |