Heim > Artikel > Backend-Entwicklung > TP5 implementiert die Methode zum Umschreiben der Sprungaufforderungsseite

TP5 implementiert die Methode zum Umschreiben der Sprungaufforderungsseite

不言Original: 2018-05-10 10:26:392921Durchsuche

In diesem Artikel wird hauptsächlich die Methode zum Umschreiben der Jump-Prompt-Seite in TP5 vorgestellt und die Änderungsschritte und zugehörigen Vorsichtsmaßnahmen für den Betrieb der thinkPHP5-Jump-Prompt-Seite anhand von Beispielen analysiert

Das Beispiel dieses Artikels beschreibt die Methode zum Umschreiben der Sprungaufforderungsseite in thinkPHP5 (TP5). Teilen Sie es als Referenz mit allen. Die Details lauten wie folgt:

Jeder weiß, dass die Erfolgs- und Misserfolgsseiten des Tp-Frameworks immer nicht besonders gut aussahen, aber dies gibt Entwicklern auch eine gute Auswahl. Wir können diese Jump-Prompt-Seite nach Ihren Wünschen umschreiben

Ich verwende das Tp5-Framework. Das Umschreiben der Jump-Prompt-Seite von Tp3 ähnelt zunächst dem von Tp3 -in Tp-Framework. Ich habe den Code für die Sprungaufforderungsseite direkt eingefügt:

{__NOLAYOUT__}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 <title>跳转提示</title>
 <style type="text/css">
  *{ padding: 0; margin: 0; }
  body{ background: #fff; font-family: "Microsoft Yahei","Helvetica Neue",Helvetica,Arial,sans-serif; color: #333; font-size: 16px; }
  .system-message{ padding: 24px 48px; }
  .system-message h1{ font-size: 100px; font-weight: normal; line-height: 120px; margin-bottom: 12px; }
  .system-message .jump{ padding-top: 10px; }
  .system-message .jump a{ color: #333; }
  .system-message .success,.system-message .error{ line-height: 1.8em; font-size: 36px; }
  .system-message .detail{ font-size: 12px; line-height: 20px; margin-top: 12px; display: none; }
 </style>
</head>
<body>
 <p class="system-message">
  <?php switch ($code) {?>
   <?php case 1:?>
   <h1>:)</h1>
   <p class="success"><?php echo(strip_tags($msg));?></p>
   <?php break;?>
   <?php case 0:?>
   <h1>:(</h1>
   <p class="error"><?php echo(strip_tags($msg));?></p>
   <?php break;?>
  <?php } ?>
  <p class="detail"></p>
  <p class="jump">
   页面自动 <a id="href" href="<?php echo($url);?>" rel="external nofollow" >跳转</a> 等待时间： <b id="wait"><?php echo($wait);?></b>
  </p>
 </p>
 <script type="text/javascript">
  (function(){
   var wait = document.getElementById(&#39;wait&#39;),
    href = document.getElementById(&#39;href&#39;).href;
   var interval = setInterval(function(){
    var time = --wait.innerHTML;
    if(time <= 0) {
     location.href = href;
     clearInterval(interval);
    };
   }, 1000);
  })();
 </script>
</body>
</html>

Schreiben Sie ihn zunächst direkt neu. Das ist fast keine Wirkung. Ich habe vergessen zu erwähnen, dass das von mir verwendete Layer-Plugin gute Arbeit leistet: http://layer.layui.com/. Wenn Sie es sehen möchten, biegen Sie bitte nach links ab.

1. Laden Sie das Layer-Plugin herunter und dekomprimieren Sie es wie folgt:

Nach der Dekomprimierung enthält es diese drei Hauptdateien, von denen wir brauchen. In die Datei wird Layer.js eingeführt

, aber vergessen Sie nicht, jquery.js einzuführen

. Schauen Sie sich dann noch ein paar weitere wichtige Codezeilen im Originalcode von Tp an:

 <p class="success"><?php echo(strip_tags($msg));?></p>
<?php echo($url);?>
<?php echo($wait);?>

Diese drei Punkte sind Aufforderungsinformationen, Sprungpfad und Wartezeit

Mit diesen können Sie beim Umschreiben versteckte Felder verwenden, um die benötigten Informationen in Form einer JQuery abzurufen und sie dann in die folgenden JS einzufügen:

<script type="text/javascript">
(function(){
layer.open({
  content: msg,
  yes: function(index, layero){
   //do something
   layer.close(index); //如果设定了yes回调，需进行手工关闭
  }
 });
 var wait = document.getElementById(&#39;wait&#39;),
  href = document.getElementById(&#39;href&#39;).href;
 var interval = setInterval(function(){
  var time = --wait.innerHTML;
  if(time <= 0) {
   location.href = href;
   clearInterval(interval);
  };
 }, 1000);
})();
</script>
var msg = $(&#39;#msg&#39;).val(); 提示信息
var url = $(&#39;#url&#39;).val();  跳转url
var wait = $(&#39;#wait&#39;).val(); 等待时间

Js neu geschrieben:

<script type="text/javascript">
  (function(){
   var msg = $(&#39;#msg&#39;).val();
   var url = $(&#39;#url&#39;).val();
   var wait = $(&#39;#wait&#39;).val();
   layer.open({
    content: msg,
    yes: function(index, layero){
     //do something
     location.href = url;
     layer.close(index); //如果设定了yes回调，需进行手工关闭
    }
   });
  })();
 </script>

Hier habe ich nicht den automatischen Sprung verwendet, sondern manuell zum Springen geklickt, also das Folgende Der Timer wurde direkt gelöscht und hatte keine Auswirkungen auf

Das Umschreiben war erfolgreich

Verwandte Empfehlungen:

Ein Beispiel für die Implementierung des E-Mail-Versanddienstes durch TP5 Kapselung und Senden von Anhängen

Das obige ist der detaillierte Inhalt vonTP5 implementiert die Methode zum Umschreiben der Sprungaufforderungsseite. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：

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

Vorheriger Artikel：thinkPHP+Ajax-Methode zur Erstellung von Statistiken über Seiten-PV-AufrufeNächster Artikel：thinkPHP+Ajax-Methode zur Erstellung von Statistiken über Seiten-PV-Aufrufe

In Verbindung stehende Artikel

Mehr sehen