2009-03-13 18 views
6

Tôi đang sử dụng ajax để cập nhật vị trí của một trang trong một khung. Nhưng khi thiết lập vị trí của băm (trên Chrome và một số phiên bản của IE (5.5) cụ thể, nhưng đôi khi trên IE7) trang đang được tải lại.Đặt location.hash trong khung

html sau đây minh họa sự cố.

khung chính .... frame.html là

<html><head> 
<frameset rows="*"> 
<frame src=sethash.html frameborder=0 scrolling=auto name=somebody> 
</frameset> 
</head></html> 

trang sethash.html là.

<html><head> 
<script language=JavaScript> 
var Count = 0; 
function sethash() 
{ 
    top.document.location.hash = "hash" + Count; 
    Count++; 
} 
</script> 
</head> 
<body onload="alert('loaded')"> 
<h1>Hello</h1> 
<input type='button' onClick='sethash()' value='Set Hash'> 
</body> 
</html>` 

Trên hầu hết các trình duyệt tải frame.html sẽ hiển thị cảnh báo được tải khi trang được tải. Sau đó, khi nút băm cài đặt được nhấn, url sẽ được thay đổi nhưng thông báo băm được nạp sẽ không hiển thị lại. Trên chrome và một số phiên bản của IE

Microsoft báo cáo có thể là cùng một vấn đề với Internet Explorer 5.5 link text

Tôi không thể sử dụng giải pháp, đó là để nắm bắt sự kiện và không cháy nó microsoft đề nghị, nhưng chỉ cần di chuyển vào chế độ xem, như đang sử dụng set top.location.hash như một phần của sự kiện onLoad.

Trả lời

6

Webkit (và mở rộng, Chrome) hoạt động lạ với location.hash. Có một vài lỗi mở về nó, có liên quan nhất có lẽ là lỗi này: https://bugs.webkit.org/show_bug.cgi?id=24578 để giải quyết vấn đề của bạn về việc làm mới trang khi location.hash bị thay đổi. Dường như lựa chọn tốt nhất của bạn ngay bây giờ là để vượt qua các ngón tay của bạn và hy vọng rằng nó được kịp thời cố định.

tôi không thể tái tạo các lỗi trong IE7 mặc dù, và bạn là người đầu tiên trong lứa tuổi I have seen that hỗ trợ IE5.5 vì vậy tôi không thể thực sự giúp bạn có;)

0

Có bạn đã thử tạo liên kết ẩn với băm và kích hoạt ngay cả trên các liên kết đó?

0

Còn việc làm location.href = '#yourhash'; Có thể nó sẽ bỏ qua lỗi này.

2

Tôi cũng gặp sự cố này. Tình trạng của tôi cho phép tôi tạo ra một sự kiện unbind cửa sổ mà thiết lập băm với giá trị tôi muốn nó cũng như trình duyệt người dùng đến trang tiếp theo hoặc làm mới. Điều này làm việc cho tôi, nhưng không chắc chắn nó sẽ làm việc cho bạn.

Với jquery, tôi đã làm:

 
if($.browser.webkit){ 
    $(window).unload(function() { 
     top.window.location.hash = hash_value; 
    }); 
}else{ 
    top.window.location.hash = hash_value; 
} 

Về mặt kỹ thuật, bạn không cần phải làm việc kiểm tra webkit, nhưng tôi nghĩ rằng đối với những người sử dụng firefox, nó có thể là tốt đẹp để thấy được giá trị băm chính xác trước khi họ làm mới bộ khung.

-Jacob

2

cho chrome và safari, bạn cần phải sử dụng window.location.href để có được băm làm việc chứ không phải là window.location.hash

xem code dưới đây

function loadHash(varHash) 
{ 
    if(varHash != undefined) { 
    var strBrowser = navigator.userAgent.toLowerCase(); 

    if (strBrowser.indexOf('chrome') > 0 || strBrowser.indexOf('safari') > 0) { 
     this.location.href = "#" + varHash; 
    } 
    else { 
     this.window.location.hash = "#" + varHash; 
    } 
    } 
} 
1

Tôi có một giải pháp thay thế và nó liên quan đến một bảng toàn trang với các iframe được nhúng. Tôi đã thay thế bộ khung của mình bằng một bảng có chiều cao 100% và chiều rộng 100% và có hai hàng. Sau đó, trong mỗi ô trong bảng, tôi đặt một khung nội tuyến chiếm 100% chiều cao và chiều rộng cho mỗi ô. Điều này, về cơ bản, bắt chước một frameset mà không cần một frameset. Hay nhất của tất cả, không tải lại về thay đổi băm!

Dưới đây là mã cũ của tôi:

<html> 
<head> 
<title>Title</title> 
</head> 
<frameset rows="48,*" frameborder="yes" border="1"> 
    <frame name="header" noresize="noresize" scrolling="no" src="http://header" target="_top"> 
    <frame name="main" src="http://body" target="_top"> 
    <noframes> 
    <body> 
    <p>This page uses frames, but your browser doesn&#39;t support them.</p> 
    </body> 
    </noframes> 
</frameset> 
</html> 

... và đây là mã mới của tôi:

<html> 
<head> 
<title>Title</title> 
<style type="text/css"> 
body { margin: 0px; padding: 0px; border: none; height: 100%; } 
table { height:100%; width:100% } 
td { padding: 0px; margin: 0px; border: none; } 
td.header { height: 48px; background-color: black; } 
td.body { background-color: silver; } 
iframe.header { border: none; width: 100%; height: 100%; } 
iframe.body { border: none; width: 100%; height: 100%; } 
</style> 
</head> 
<body> 
<table cellpadding="0" cellspacing="0"> 
    <tr><td class="header"><iframe class="header" src="http://header" target="_top" scrolling="no"></iframe></td></tr> 
    <tr><td class="body"><iframe class="body" src="http://body" scrolling="no"></iframe></td></tr> 
</table> 
</body> 
</html> 

Hope this helps.

3

Bạn cũng có thể sử dụng HTML5 history.pushState() để thay đổi băm mà không cần tải lại trang trong Chrome. Một cái gì đó như thế này:

// frameset hash change function 
function changeHash(win, hash) { 
    if(history.pushState) { 
     win.history.replaceState(null, win.document.title, '#'+hash); 
    } else { 
     win.location.hash = hash; 
    } 
} 

Trong đối số đầu tiên, bạn cần phải vượt qua cửa sổ trên cùng của khung.

+0

Tác phẩm này. Ghi chú nhỏ: [Chrome hiển thị một nhấp nháy trong biểu tượng favicon và nút dừng/làm mới] (http://code.google.com/p/chromium/issues/detail?id=50298), trông có vẻ xấu xí. – Blaise

Các vấn đề liên quan