Heim > Web-Frontend > js-Tutorial > Hauptteil

Springen Sie basierend auf JS zur entsprechenden mobilen Webseite, wenn das mobile Endgerät auf die PC-Seite_Javascript-Fähigkeiten zugreift

WBOY
Freigeben: 2016-05-16 15:05:30
Original
1558 Leute haben es durchsucht

Wenn Sie die adaptive CSS-Anzeige nicht verwenden möchten, um unterschiedliche Stile auf dem PC und mobilen Endgeräten anzuzeigen, können Sie nur zur entsprechenden mobilen Webseite springen, wenn Sie auf die PC-Webseite auf dem mobilen Endgerät zugreifen Es gibt auch Optionen im Internet. In vielen Artikeln wird angegeben, dass die folgenden Implementierungsideen vom Herausgeber getestet wurden und bedenkenlos verwendet werden können.

1. Rendern

PC-Zugriffsanzeige:

Mobile Zutrittsanzeige:

2. Umsetzung:

Wenn Sie keine mobile Suchmaschinenoptimierung in Betracht ziehen, müssen Sie nur JS verwenden, um festzustellen, ob es mobil ist, und dann bestimmen, ob Sie zur angegebenen Seite springen möchten. Das Haupt-JS lautet wie folgt:

//判断是否移动端,如果是则跳转到指定的URL地址
function browserRedirect(url) {
//只读的字符串,声明了浏览器用于 HTTP 请求的用户代理头的值
var sUserAgent = navigator.userAgent.toLowerCase();
var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
var bIsMidp = sUserAgent.match(/midp/i) == "midp";
var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
var bIsAndroid = sUserAgent.match(/android/i) == "android";
var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
if (bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
window.location.replace(url);
}
}
Nach dem Login kopieren

Dann verweisen Sie auf der Seite auf JS und rufen Sie die Methode auf:

<script src="../js/wap.js"></script>
<script type="text/javascript">browserRedirect("http://ycdoit.com/test/testmobile.html");</script> 
Nach dem Login kopieren

Freundliche Erinnerung von Script House: Sie können mit Ihrem PC und Mobilgerät die Testseite besuchen, um die Wirkung zu demonstrieren!

Dieser Artikel führt Sie in die JS-basierte Implementierung des Springens zur entsprechenden mobilen Webseite ein, wenn das mobile Endgerät auf die PC-Seite zugreift. Ich hoffe, er wird Ihnen hilfreich sein!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage
Über uns Haftungsausschluss Sitemap
Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!