2010-07-15 24 views
19

Tôi có một trang web, nơi tôi đang cố gắng sử dụng Ajax để cập nhật một số nội dung trên trang mà không cần tải lại. Tuy nhiên, có nhiều khả năng nhiều người dùng của tôi sẽ sử dụng các trình duyệt di động không hỗ trợ Javascript nên tôi đang cố gắng thiết kế trang bằng thẻ làm mới meta, bằng cách nào đó chỉ hoạt động cho người dùng không có Javascript. Có cách nào để làm điều này không?Sử dụng Javascript để ghi đè hoặc tắt thẻ làm mới meta

Tôi đã thử đặt thẻ trong phần tử noscript, nhưng trình duyệt điện thoại di động nguyên thủy của tôi sẽ không thừa nhận nó. Tôi nghĩ có thể thiết lập một cookie để nhớ nếu trình duyệt của người dùng hỗ trợ Javascript, hoặc có một phiên bản của trang hoạt động mà không có Javascript, và cố gắng sử dụng Javascript để chuyển hướng người dùng sang phiên bản tinh vi hơn, nhưng tôi tự hỏi liệu có là một cách thanh lịch hơn để làm điều đó. Có ai có ý tưởng nào?

+0

Tôi nghĩ rằng tôi đã học được từ câu hỏi này rằng những gì tôi đang cố gắng làm là rất nhiều rắc rối và có lẽ không đáng để chi tiêu và giải quyết mọi vấn đề.Tôi nghĩ rằng tôi có thể chuyển hướng như Hrishi đề xuất, hoặc nếu tôi muốn các trang Javascript và không phải Javascript sử dụng cùng một URL, tôi chỉ có thể sử dụng thẻ làm mới meta nếu người dùng chọn bật chúng và nhớ lựa chọn của người dùng bằng cookie. Cảm ơn tất cả các câu trả lời của bạn. –

Trả lời

3

Thẻ meta quá khủng khiếp trong trường hợp này. Điều gì về công cụ tìm kiếm ??

Điều bạn cần làm là làm cho nó giống như tôi đã phác thảo here. Các liên kết của bạn nên trỏ đến các trang web hoạt động đầy đủ như thể đó là trang web 2.0. Sau đó, với trình xử lý sự kiện (onclick), bạn nâng cao trải nghiệm người dùng bằng cách sử dụng ajax.

Vì vậy, người dùng ajax sẽ không đi đến liên kết, liên kết được xử lý khá tốt khi được nhấp và gửi yêu cầu ajax đến cùng một url chính xác nhưng với tham số GET ajax.

Bây giờ ở phía máy chủ, bạn phải có thể tạo toàn bộ trang web theo một số phương pháp. Nếu đó là yêu cầu ajax bạn gửi nội dung liên quan. Nếu nó không phải là một yêu cầu ajax, yo tạo ra các trang web đầy đủ với các phần liên quan nhúng.

Trang web của bạn sẽ SEO thân thiện, sẵn cho người dùng điện thoại di động, và dần dần tăng cường cho người dân trên các trình duyệt hiện đại và nền tảng. Cuối cùng ajax tạo ra các liên kết băm sẽ có thể sử dụng được, ngay cả khi liên kết.

Awesomeness. :)

+2

Thẻ meta khủng khiếp như thế nào? Tôi không cố gắng sử dụng chúng để chuyển hướng. Tôi chỉ sử dụng chúng để làm mới trang, như một dự phòng cho người dùng không có hỗ trợ Javascript. Tôi không thấy làm thế nào mà sẽ ảnh hưởng đến công cụ tìm kiếm. Tôi không hoàn toàn chắc chắn nếu đây là những gì tôi muốn làm, nhưng tôi vẫn tò mò như thế nào tôi sẽ làm điều đó. –

+0

bạn không thể tìm ra cách bạn nên làm điều đó, không phải là đủ cho bạn? :) Bạn đã kiểm tra liên kết chưa ??? – galambalazs

+1

Tôi đã kiểm tra liên kết. Có vẻ như khó để làm phức tạp mã trên máy chủ của tôi để phân phối dữ liệu theo 2 cách. Nếu tôi làm điều đó, tôi sẽ phải đối phó với một số quirks. Nếu tôi đặt một phần quan trọng của URL sau dấu #, và ai đó đánh dấu trang và cố truy cập nó, nó sẽ không tải như bình thường trừ khi tôi có một số JS để tải nội dung. Điều tương tự nếu người dùng nhấn nút quay lại. Tôi không chắc liệu nó có tốt cho các công cụ tìm kiếm để tạo URL của tôi theo cách này hay không. Họ có thể thấy số # và cho rằng đó chỉ là liên kết đến các phần khác nhau của cùng một trang. Tôi nghĩ rằng nó có thể đơn giản hơn với thẻ meta refresh. –

1

Tôi đồng ý rằng làm mới meta không phải là con đường đúng ở đây. Ngoài liên kết của galambalaz, hãy tìm kiếm "tăng cường tiến bộ".

Tuy nhiên, theo tinh thần trả lời câu hỏi, bạn có thể thử cách sau. Nó chưa được kiểm tra, có thể không hoạt động trong tất cả các trình duyệt, nhưng phải nằm dọc theo các dòng bên phải:

var i, refAttr; 
var metaTags = document.getElementsByTagName('meta'); 
for i in metaTags { 
    if((refAttr = metaTags[i].getAttribute("http-equiv")) && (refAttr == 'refresh')) { 
     metaTags[i].parentNode.removeChild(metaTags[i]); 
    } 
} 

Cho dù việc xóa nó sẽ làm cho trình duyệt không làm mới kịp thời.

+0

Thẻ meta không thể bị ghi đè bởi JavaScript. – Hrishi

+0

Tôi đã thử rằng trong Firefox (sau khi đặt "i in metaTags" trong dấu ngoặc đơn). Tôi gặp lỗi Javascript nói "metaTags [i] .getAttribute". Tôi đoán nó không thể được thực hiện, ít nhất không phải như vậy. –

+1

bạn không thể sử dụng vòng lặp for (i in ...) tại đây. toán tử 'in' lặp qua các khóa của một đối tượng. Trong trường hợp này, bạn cần phải sử dụng một vòng lặp số thông thường: 'cho (i = metaTags.length-1; i> = 0; i--) {...}' Bạn lặp lại bởi vì removeChild sẽ thay đổi thẻ metaTags. chiều dài – bluesmoon

10

Bạn không thể ghi đè thẻ làm mới meta bằng JavaScript.

Tuy nhiên bạn có thể làm điều này

Giả sử trang web của bạn là ->

http://example.net/mike.html Đặt đoạn mã sau there->

<script type="text/javascript"> 
window.location = 'http://example.net/mike/for_Those_With_JavaScript_Enabled.html'; 
</script> 
+2

Ý tôi là thay vì chuyển hướng các trình duyệt đã tắt JavaScript, bạn có thể chuyển hướng các trình duyệt đã bật JavaScript. – Hrishi

+0

Điều đó khá thông minh. Nó sạch sẽ, đơn giản và giải quyết vấn đề. – LandonSchropp

+4

điều này lộn xộn với nút quay lại mặc dù. người dùng nhấp vào nút quay lại có bật javascript sẽ bị kẹt trong vòng chuyển hướng. họ cần phải nhấp đúp vào nút quay lại để thoát khỏi nó. – bluesmoon

3

Chỉ cần loại bỏ các thẻ meta với javascript:

<meta http-equiv="refresh" content="2;http://new-url/" id="meta-refresh"> 

<script type="text/javascript"> 
var mr = document.getElementById("meta-refresh"); 
mr.parentNode.removeChild(mr); 
</script> 

Tôi đã đặt thời gian làm mới ut đến 2 giây ở trên chỉ là một ví dụ. Bạn có thể có thể lấy đi với 1 giây là tốt, nhưng không đặt nó 0 vì javascript sẽ không có cơ hội để thực hiện trong trường hợp đó. 0 cũng gây phiền nhiễu vì nó phá vỡ khả năng sử dụng nút quay lại.

Chỉnh sửa 2012-10-23 Điều này dường như không hoạt động nữa. Nút vẫn bị xóa, nhưng có vẻ như các trình duyệt phân tích cú pháp và giữ trong bộ nhớ tất cả các thẻ meta theo bất kỳ cách nào.

+0

có hoạt động không? có thể trình duyệt đã trở nên nghiêm ngặt hơn, dường như không hoạt động nữa. Pity – TimoSolo

+0

@Timothy Cách giải quyết là truy xuất đánh dấu gốc, tìm và thay thế phần tử làm mới meta, rồi viết tài liệu mới với đánh dấu thay thế. Xem câu trả lời của tôi: [http://stackoverflow.com/questions/3252743/using-javascript-to-override-or-disable-meta-refresh-tag/13656851#13656851](http://stackoverflow.com/questions/ 3252743/sử dụng-javascript-để-ghi đè-hoặc-vô hiệu hóa-meta-refresh-tag/13656851 # 13656851). – XP1

+0

Tôi đã không thử nghiệm điều này nhưng về mặt lý thuyết, tôi không nghĩ rằng điều này có thể làm việc. Làm mới meta sử dụng thẻ meta http-equiv để mô phỏng tiêu đề Làm mới HTTP và do đó cũng có thể được gửi dưới dạng tiêu đề của máy chủ web HTTP. Vì js xuất hiện sau khi phản hồi được gửi, tiêu đề chuyển hướng đã biến mất –

9

Tôi nhận thấy rằng thẻ noscript hoạt động khá độc đáo với điều này. Ví dụ, bạn có thể đặt điều này chỉ sau khi bạn gần các yếu tố đầu:

<noscript> 
    <meta http-equiv="refresh" content="5;URL=http://www.example.com"> 
</noscript> 

Không cần phải loại bỏ các thẻ meta với kịch bản, kể từ khi trình duyệt có hỗ trợ kịch bản sẽ bỏ qua tất cả mọi thứ bên trong phần tử noscript.

+0

điều này dường như không hoạt động –

+0

Bạn có thể cung cấp thêm chi tiết về việc sử dụng của mình không? Tôi đã sử dụng thành công trên một số trang web và được thử nghiệm trên nhiều trình duyệt trên máy tính để bàn và thiết bị di động. – Shaun

+0

đã xác nhận hoạt động trong Firefox, Chrome, IE7/9 – Kita

6

Thật không may, từ @bluesmoon's answer, thao tác DOM không hoạt động nữa.

Giải pháp thay thế là truy xuất đánh dấu gốc, tìm và thay thế phần tử làm mới meta, sau đó viết tài liệu mới bằng đánh dấu thay thế.

Tôi không chắc chắn cách truy xuất đánh dấu gốc bằng JavaScript ngoại trừ việc gửi yêu cầu bổ sung bằng cách sử dụng XMLHttpRequest.

Trong Opera, đây là những gì tôi đang sử dụng:

Disable meta refresh 1.00.js:

// ==UserScript== 
// @name Disable meta refresh 
// @version 1.00 
// @description Disables meta refresh. 
// @namespace https://stackoverflow.com/questions/3252743/using-javascript-to-override-or-disable-meta-refresh-tag/13656851#13656851 
// @copyright 2012 
// @author XP1 
// @homepage https://github.com/XP1/ 
// @license Apache License, Version 2.0; http://www.apache.org/licenses/LICENSE-2.0 
// @include http*://example.com/* 
// @include http*://*.example.com/* 
// ==/UserScript== 

/* 
* Copyright 2012 XP1 
* 
* Licensed under the Apache License, Version 2.0 (the "License"); 
* you may not use this file except in compliance with the License. 
* You may obtain a copy of the License at 
* 
*  http://www.apache.org/licenses/LICENSE-2.0 
* 
* Unless required by applicable law or agreed to in writing, software 
* distributed under the License is distributed on an "AS IS" BASIS, 
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. 
* See the License for the specific language governing permissions and 
* limitations under the License. 
*/ 

/*jslint browser: true, vars: true, maxerr: 50, indent: 4 */ 
(function (window, XMLHttpRequest) { 
    "use strict"; 

    if (window.self !== window.top) { 
     return; 
    } 

    window.stop(); 

    var uri = window.location.href; 

    var request = new XMLHttpRequest(); 
    request.open("GET", uri, false); 
    request.send(null); 

    if (!(request.readyState === 4 && request.status === 200)) { 
     return; 
    } 

    var markup = request.responseText; 
    markup = markup.replace(/<meta http-equiv="refresh".*\/?>/gi, ""); 

    var document = window.document; 
    document.open(); 
    document.write(markup); 
    document.close(); 
}(this, this.XMLHttpRequest)); 

Opera cũng đã tích hợp sẵn trong tính năng vô hiệu hóa hàm nạp lại sau. Không cần JavaScript.

  • Nhấp chuột phải vào trang web> Chỉnh sửa tùy chọn trang web ...> Mạng> Tắt "Bật chuyển hướng tự động"> OK.
+0

Sẽ phải kiểm tra điều này ..Cảm ơn! – TimoSolo

0

Đây là ví dụ về những gì tôi sử dụng và nó hoạt động hoàn hảo (đặc biệt là trên Firefox)!

<html><head> 
<meta http-equiv="content-type" content="text/html;charset=utf-8"> 
<title>Redirecting</title> 
</head> 
<body onload="location.replace('http://www.live.comeseetv.com'+document.location.hash)"> 
<a href="http://www.live.comeseetv.com">Redirecting you to http://www.live.comeseetv.com</a> 
</body></html> 
2

Điều này làm việc cho tôi tuyệt vời! (thử trong chrome)

window.stop(); 
Các vấn đề liên quan