Heim > Artikel > Backend-Entwicklung > Implementierungsmethode zum Umschreiben der Sprungaufforderungsseite in TP5

Implementierungsmethode zum Umschreiben der Sprungaufforderungsseite in TP5

黄舟Original: 2017-10-30 09:05:532244Durchsuche

Das Beispiel in diesem Artikel 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 Wahl Wir können diese Sprungaufforderungsseite nach unseren eigenen Vorlieben umschreiben

Ich verwende das Tp5-Framework. Das Umschreiben der Sprungaufforderungsseite von Tp5 ähnelt zunächst dem von Tp3 Tp-Framework. Ich habe den Code für die mitgelieferte 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>

Zuerst kann das CSS direkt gelöscht werden Ich habe vergessen, es zu erwähnen. Dieses Plug-in leistet gute Arbeit: http://layer.layui.com/ Biegen Sie links ab

1. Laden Sie das Layer-Plug-in herunter und dekomprimieren Sie es. Das dekomprimierte Dateipaket lautet wie folgt:

Nach der Dekomprimierung enthält es diese drei Hauptdateien, unter denen die Ebene, die wir in die Datei einfügen müssen, .js ist

Aber vergessen Sie nicht, jquery.js einzuführen

Dann werfen wir einen Blick auf einige der wichtigeren Codezeilen im Originalcode von Tp:

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

Diese drei Punkte sind Eingabeaufforderungsinformationen, Sprungpfad und Wartezeit

Mit diesen können Sie beim Umschreiben die Hidden-Field-Technik verwenden. Verwenden Sie das versteckte Feld, um die benötigten Informationen über jquery abzurufen. Fügen Sie sie dann in das folgende js ein:

<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(); 等待时间

Umgeschriebenes js:

<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 keinen automatischen Sprung verwendet. aber manuell klicken, um zu springen, also Folgendes: Der Timer wurde direkt gelöscht, ohne Auswirkungen auf

Das Umschreiben war erfolgreich

Das obige ist der detaillierte Inhalt vonImplementierungsmethode zum Umschreiben der Sprungaufforderungsseite in TP5. 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：Detaillierte Erläuterung der zugehörigen Konfigurationen und Fehlerbehebung in phpmyadminNächster Artikel：Detaillierte Erläuterung der zugehörigen Konfigurationen und Fehlerbehebung in phpmyadmin

In Verbindung stehende Artikel

Mehr sehen