当前位置：首页 > CMS教程 > Thinkphp > 列表

Thinkphp自定义美化success和error提示跳转页面代码实例

发布:smiling　来源: PHP粉丝网 　添加日期：2022-04-17 09:49:14　浏览: 评论：0　

这篇文章主要介绍了Thinkphp自定义美化success和error提示跳转页面代码实例，有需要的同学可以直接借鉴文中代码，可以增加页面的美观和友好程度。

先贴效果图：

优点：图标是有动画效果的，不需要背景图片。

1、需要引用一个dialog.css，代码如下： 

  1. /* =========================================== 
  2.  @des:     dialog.less 
  3.  @author:   美奇软件开发工作室 
  4.  @QQ:     15577969 
  5.  @赞助平台：  元宝支付（18pay.net） 
  6.  @time:    2021-01-10 
  7.  =============================================*/ 
  8.    
  9. @charset "utf-8"; 
  10. .clearfix { 
  11.  *zoom: 1; 
  12. } 
  13. .clearfix:after { 
  14.  visibility: hidden; 
  15.  display: block; 
  16.  font-size: 0; 
  17.  content: " "; 
  18.  clear: both; 
  19.  height: 0; 
  20. } 
  21. * { 
  22.  margin: 0; 
  23.  padding: 0; 
  24. } 
  25. ul, 
  26. ol { 
  27.  list-style: none; 
  28. } 
  29. img { 
  30.  border: none; 
  31. } 
  32. input, 
  33. select, 
  34. textarea { 
  35.  outline: none; 
  36.  border: none; 
  37.  background: none; 
  38. } 
  39. textarea { 
  40.  resize: none; 
  41. } 
  42. a { 
  43.  text-decoration: none; 
  44. } 
  45. .body { 
  46.  font-family: 14px "Microsoft Yahei", "微软雅黑", Arial, Tahoma; 
  47. } 
  48. .btn-container { 
  49.  width: 100%; 
  50.  display: flex; 
  51.  display: -webkit-flex; 
  52.  display: -moz-flex; 
  53.  justify-content: space-around; 
  54.  -webkit-justify-content: space-around; 
  55.  -moz-justify-content: space-around; 
  56. } 
  57. .btn-container input[type='button'] { 
  58.  width: 20%; 
  59.  padding: 0.357rem; 
  60.  color: #fff; 
  61.  border-radius: 3px; 
  62.  -webkit-radius: 3px; 
  63.  -moz-radius: 3px; 
  64.  background-color: #3B9DFF; 
  65. } 
  66. .btn-container input[type='button']:active { 
  67.  background-color: #1966b3; 
  68. } 
  69. /*重置盒模型 */ 
  70. .boxContent * { 
  71.  box-sizing: content-box; 
  72.  -webkit-box-sizing: content-box; 
  73.  -moz-box-sizing: content-box; 
  74. } 
  75. /*animation start*/ 
  76. #animationTipBox { 
  77.  width: 100%; 
  78.  height: auto; 
  79.  background-color: #fff; 
  80.  border-radius: 8px; 
  81.  -webkit-border-radius: 8px; 
  82.  -moz-border-radius: 8px; 
  83.  position: fixed; 
  84.  left: 50%; 
  85.  top: 30%; 
  86.  margin-left: -50%; 
  87.  margin-top: -75px; 
  88.  z-index: 1001; 
  89.  -webkit-animation: alertAnimation 0.3s ease-in-out 0s 1; 
  90.  -moz-animation: alertAnimation 0.3s ease-in-out 0s 1; 
  91.  animation: alertAnimation 0.3s ease-in-out 0s 1; 
  92. } 
  93. #animationTipBox * { 
  94.  box-sizing: content-box; 
  95.  -webkit-box-sizing: content-box; 
  96.  -moz-box-sizing: content-box; 
  97. } 
  98. #animationTipBox .icon { 
  99.  position: relative; 
  100.  width: 80px; 
  101.  height: 80px; 
  102.  border-radius: 50px; 
  103.  -webkit-border-radius: 50px; 
  104.  -moz-border-radius: 50px; 
  105.  border: 4px solid #66cc33; 
  106.  margin: 15px auto 5px auto; 
  107. } 
  108. #animationTipBox .icon_box { 
  109.  width: 80px; 
  110.  height: 80px; 
  111.  margin: 0 auto; 
  112.  text-align: center; 
  113.  position: relative; 
  114. } 
  115. #animationTipBox .lose .icon { 
  116.  border-color: #FF9090; 
  117. } 
  118. #animationTipBox .lose .icon_box { 
  119.  -webkit-animation: lose_Animation 0.5s ease 0s 1; 
  120.  -moz-animation: lose_Animation 0.5s ease 0s 1; 
  121.  animation: lose_Animation 0.5s ease 0s 1; 
  122. } 
  123. #animationTipBox .dec_txt { 
  124.  font-size: 16px; 
  125.  text-align: center; 
  126.  color: #666; 
  127.  line-height: 26px; 
  128.  height: 26px; 
  129.  padding: 5px 0 10px 0; 
  130. } 
  131. .tip .icon { 
  132.  width: 80px; 
  133.  height: 80px; 
  134.  background-color: #66cc33; 
  135.  border-radius: 100%; 
  136.  -webkit-border-radius: 100%; 
  137.  -moz-border-radius: 100%; 
  138.  color: #fff; 
  139.  font-size: 80px; 
  140.  text-align: center; 
  141.  line-height: 80px; 
  142. } 
  143. .success .line_short { 
  144.  width: 25px; 
  145.  height: 5px; 
  146.  position: absolute; 
  147.  left: 14px; 
  148.  top: 46px; 
  149.  border-radius: 4px; 
  150.  -webkit-border-radius: 4px; 
  151.  -moz-border-radius: 4px; 
  152.  background-color: #66cc33; 
  153.  transform: rotate(45deg); 
  154.  -webkit-transform: rotate(45deg); 
  155.  -moz-transform: rotate(45deg); 
  156.  -webkit-animation: success_short_Animation 0.65s ease 0s 1; 
  157.  -moz-animation: success_short_Animation 0.65s ease 0s 1; 
  158.  animation: success_short_Animation 0.65s ease 0s 1; 
  159. } 
  160. .success .line_long { 
  161.  width: 47px; 
  162.  height: 5px; 
  163.  position: absolute; 
  164.  right: 8px; 
  165.  top: 38px; 
  166.  border-radius: 4px; 
  167.  -webkit-border-radius: 4px; 
  168.  -moz-border-radius: 4px; 
  169.  background-color: #66cc33; 
  170.  transform: rotate(-45deg); 
  171.  -webkit-transform: rotate(-45deg); 
  172.  -moz-transform: rotate(-45deg); 
  173.  -webkit-animation: success_long_Animation 0.65s ease 0s 1; 
  174.  -moz-animation: success_long_Animation 0.65s ease 0s 1; 
  175.  animation: success_long_Animation 0.65s ease 0s 1; 
  176. } 
  177. .lose .line_left, 
  178. .lose .line_right { 
  179.  width: 47px; 
  180.  height: 5px; 
  181.  position: absolute; 
  182.  left: 17px; 
  183.  top: 37px; 
  184.  border-radius: 4px; 
  185.  -webkit-border-radius: 4px; 
  186.  -moz-border-radius: 4px; 
  187.  background-color: #FF9090; 
  188.  transform: rotate(45deg); 
  189.  -webkit-transform: rotate(45deg); 
  190.  -moz-transform: rotate(45deg); 
  191. } 
  192. .lose .line_right { 
  193.  right: 11px; 
  194.  top: 37px; 
  195.  transform: rotate(-45deg); 
  196.  -webkit-transform: rotate(-45deg); 
  197.  -moz-transform: rotate(-45deg); 
  198. } 
  199. /* 总体动画 函数 */ 
  200. /*all animate*/ 
  201. @-webkit-keyframes alertAnimation { 
  202.  0% { 
  203.   -webkit-transform: scale(0.5); 
  204.  } 
  205.  45% { 
  206.   -webkit-transform: scale(1.25); 
  207.  } 
  208.  80% { 
  209.   -webkit-transform: scale(0.95); 
  210.  } 
  211.  100% { 
  212.   -webkit-transform: scale(1); 
  213.  } 
  214. } 
  215. @-moz-keyframes alertAnimation { 
  216.  0% { 
  217.   -webkit-transform: scale(0.5); 
  218.  } 
  219.  45% { 
  220.   -webkit-transform: scale(1.25); 
  221.  } 
  222.  80% { 
  223.   -webkit-transform: scale(0.95); 
  224.  } 
  225.  100% { 
  226.   -webkit-transform: scale(1); 
  227.  } 
  228. } 
  229. @-webkit-keyframes alertAnimation { 
  230.  0% { 
  231.   -webkit-transform: scale(0.5); 
  232.  } 
  233.  45% { 
  234.   -webkit-transform: scale(1.25); 
  235.  } 
  236.  80% { 
  237.   -webkit-transform: scale(0.95); 
  238.  } 
  239.  100% { 
  240.   -webkit-transform: scale(1); 
  241.  } 
  242. } 
  243. /*all animate*/ 
  244. /*success short animate*/ 
  245. @-webkit-keyframes success_short_Animation { 
  246.  0% { 
  247.   width: 0; 
  248.   left: 1px; 
  249.   top: 19px; 
  250.  } 
  251.  54% { 
  252.   width: 0; 
  253.   left: 1px; 
  254.   top: 19px; 
  255.  } 
  256.  70% { 
  257.   width: 50px; 
  258.   left: -4px; 
  259.   top: 37px; 
  260.  } 
  261.  84% { 
  262.   width: 17px; 
  263.   left: 21px; 
  264.   top: 48px; 
  265.  } 
  266.  100% { 
  267.   width: 25px; 
  268.   left: 14px; 
  269.   top: 45px; 
  270.  } 
  271. } 
  272. @-moz-keyframes success_short_Animation { 
  273.  0% { 
  274.   width: 0; 
  275.   left: 1px; 
  276.   top: 19px; 
  277.  } 
  278.  54% { 
  279.   width: 0; 
  280.   left: 1px; 
  281.   top: 19px; 
  282.  } 
  283.  70% { 
  284.   width: 50px; 
  285.   left: -4px; 
  286.   top: 37px; 
  287.  } 
  288.  84% { 
  289.   width: 17px; 
  290.   left: 21px; 
  291.   top: 48px; 
  292.  } 
  293.  100% { 
  294.   width: 25px; 
  295.   left: 14px; 
  296.   top: 45px; 
  297.  } 
  298. } 
  299. @-webkit-keyframes success_short_Animation { 
  300.  0% { 
  301.   width: 0; 
  302.   left: 1px; 
  303.   top: 19px; 
  304.  } 
  305.  54% { 
  306.   width: 0; 
  307.   left: 1px; 
  308.   top: 19px; 
  309.  } 
  310.  70% { 
  311.   width: 50px; 
  312.   left: -4px; 
  313.   top: 37px; 
  314.  } 
  315.  84% { 
  316.   width: 17px; 
  317.   left: 21px; 
  318.   top: 48px; 
  319.  } 
  320.  100% { 
  321.   width: 25px; 
  322.   left: 14px; 
  323.   top: 45px; 
  324.  } 
  325. } 
  326. /*success short animate*/ 
  327. /*success long animate*/ 
  328. @-webkit-keyframes success_long_Animation { 
  329.  0% { 
  330.   width: 0; 
  331.   right: 46px; 
  332.   top: 54px; 
  333.  } 
  334.  65% { 
  335.   width: 0; 
  336.   right: 46px; 
  337.   top: 54px; 
  338.  } 
  339.  84% { 
  340.   width: 55px; 
  341.   right: 0px; 
  342.   top: 35px; 
  343.  } 
  344.  100% { 
  345.   width: 47px; 
  346.   right: 8px; 
  347.   top: 38px; 
  348.  } 
  349. } 
  350. @-moz-keyframes success_long_Animation { 
  351.  0% { 
  352.   width: 0; 
  353.   right: 46px; 
  354.   top: 54px; 
  355.  } 
  356.  65% { 
  357.   width: 0; 
  358.   right: 46px; 
  359.   top: 54px; 
  360.  } 
  361.  84% { 
  362.   width: 55px; 
  363.   right: 0px; 
  364.   top: 35px; 
  365.  } 
  366.  100% { 
  367.   width: 47px; 
  368.   right: 8px; 
  369.   top: 38px; 
  370.  } 
  371. } 
  372. @-webkit-keyframes success_long_Animation { 
  373.  0% { 
  374.   width: 0; 
  375.   right: 46px; 
  376.   top: 54px; 
  377.  } 
  378.  65% { 
  379.   width: 0; 
  380.   right: 46px; 
  381.   top: 54px; 
  382.  } 
  383.  84% { 
  384.   width: 55px; 
  385.   right: 0px; 
  386.   top: 35px; 
  387.  } 
  388.  100% { 
  389.   width: 47px; 
  390.   right: 8px; 
  391.   top: 38px; 
  392.  } 
  393. } 
  394. /*success long animate*/ 
  395. /*load_Animation*/ 
  396. @-webkit-keyframes load_Animation { 
  397.  0% { 
  398.   -webkit-transform: scale(0.6); 
  399.   opacity: 0.2; 
  400.  } 
  401.  50% { 
  402.   -webkit-transform: scale(0.6); 
  403.   opacity: 0.5; 
  404.  } 
  405.  80% { 
  406.   -webkit-transform: scale(1.15); 
  407.   opacity: 0.8; 
  408.  } 
  409.  100% { 
  410.   -webkit-transform: scale(1); 
  411.   opacity: 1.0; 
  412.  } 
  413. } 
  414. @-moz-keyframes load_Animation { 
  415.  0% { 
  416.   -webkit-transform: scale(0.6); 
  417.   opacity: 0.2; 
  418.  } 
  419.  50% { 
  420.   -webkit-transform: scale(0.6); 
  421.   opacity: 0.5; 
  422.  } 
  423.  80% { 
  424.   -webkit-transform: scale(1.15); 
  425.   opacity: 0.8; 
  426.  } 
  427.  100% { 
  428.   -webkit-transform: scale(1); 
  429.   opacity: 1.0; 
  430.  } 
  431. } 
  432. @-webkit-keyframes load_Animation { 
  433.  0% { 
  434.   -webkit-transform: scale(0.6); 
  435.   opacity: 0.2; 
  436.  } 
  437.  50% { 
  438.   -webkit-transform: scale(0.6); 
  439.   opacity: 0.5; 
  440.  } 
  441.  80% { 
  442.   -webkit-transform: scale(1.15); 
  443.   opacity: 0.8; 
  444.  } 
  445.  100% { 
  446.   -webkit-transform: scale(1); 
  447.   opacity: 1.0; 
  448.  } 
  449. } 
  450. /*load_Animation*/ 
  451. /*lose_Animation*/ 
  452. @-webkit-keyframes lose_Animation { 
  453.  0% { 
  454.   -webkit-transform: scale(0.6); 
  455.   opacity: 0.2; 
  456.  } 
  457.  50% { 
  458.   -webkit-transform: scale(0.6); 
  459.   opacity: 0.5; 
  460.  } 
  461.  80% { 
  462.   -webkit-transform: scale(1.15); 
  463.   opacity: 0.8; 
  464.  } 
  465.  100% { 
  466.   -webkit-transform: scale(1); 
  467.   opacity: 1.0; 
  468.  } 
  469. } 
  470. @-moz-keyframes lose_Animation { 
  471.  0% { 
  472.   -webkit-transform: scale(0.6); 
  473.   opacity: 0.2; 
  474.  } 
  475.  50% { 
  476.   -webkit-transform: scale(0.6); 
  477.   opacity: 0.5; 
  478.  } 
  479.  80% { 
  480.   -webkit-transform: scale(1.15); 
  481.   opacity: 0.8; 
  482.  } 
  483.  100% { 
  484.   -webkit-transform: scale(1); 
  485.   opacity: 1.0; 
  486.  } 
  487. } 
  488. @-webkit-keyframes lose_Animation { 
  489.  0% { 
  490.   -webkit-transform: scale(0.6); 
  491.   opacity: 0.2; 
  492.  } 
  493.  50% { 
  494.   -webkit-transform: scale(0.6); 
  495.   opacity: 0.5; 
  496.  } 
  497.  80% { 
  498.   -webkit-transform: scale(1.15); 
  499.   opacity: 0.8; 
  500.  } 
  501.  100% { 
  502.   -webkit-transform: scale(1); 
  503.   opacity: 1.0; 
  504.  } 
  505. } 
  506. /*lose_Animation*/ 
  507. .load { 
  508.  position: relative; 
  509.  width: 60px; 
  510.  height: 80px; 
  511.  border-radius: 50px; 
  512.  -webkit-border-radius: 50px; 
  513.  -moz-border-radius: 50px; 
  514.  border: 4px solid #fff; 
  515.  margin: 15px auto 5px auto; 
  516.  top: 10px; 
  517. } 
  518. .load .icon_box { 
  519.  margin: 10px auto; 
  520.  width: 60px; 
  521.  height: 60px; 
  522. } 
  523. .load .cirBox1, 
  524. .load .cirBox2, 
  525. .load .cirBox3 { 
  526.  width: 60px; 
  527.  height: 60px; 
  528.  position: absolute; 
  529.  left: 0; 
  530.  top: 0; 
  531. } 
  532. .load .cirBox1 > div, 
  533. .load .cirBox2 > div, 
  534. .load .cirBox3 > div { 
  535.  width: 10px; 
  536.  height: 10px; 
  537.  border-radius: 100%; 
  538.  -webkit-border-radius: 100%; 
  539.  -moz-border-radius: 100%; 
  540.  background-color: #ccc; 
  541.  position: absolute; 
  542. } 
  543. .load .cirBox1 { 
  544.  transform: rotate(30deg); 
  545.  -webkit-transform: rotate(30deg); 
  546.  -moz-transform: rotate(30deg); 
  547. } 
  548. .load .cirBox2 { 
  549.  transform: rotate(60deg); 
  550.  -webkit-transform: rotate(60deg); 
  551.  -moz-transform: rotate(60deg); 
  552. } 
  553. .load .cirBox3 { 
  554.  transform: rotate(90deg); 
  555.  -webkit-transform: rotate(90deg); 
  556.  -moz-transform: rotate(90deg); 
  557. } 
  558. .load .cir1 { 
  559.  left: 0; 
  560.  top: 0; 
  561. } 
  562. .load .cir2 { 
  563.  right: 0; 
  564.  top: 0; 
  565. } 
  566. .load .cir3 { 
  567.  right: 0; 
  568.  bottom: 0; 
  569. } 
  570. .load .cir4 { 
  571.  left: 0; 
  572.  bottom: 0; 
  573. } 
  574. .load .cir1, 
  575. .load .cir2, 
  576. .load .cir3, 
  577. .load .cir4 { 
  578.  -webkit-animation: cir_Animation 1.2s ease 0s infinite; 
  579.  -moz-animation: cir_Animation 1.2s ease 0s infinite; 
  580.  animation: cir_Animation 1.2s ease 0s infinite; 
  581. } 
  582. .cirBox1 .cir2 { 
  583.  -webkit-animation-delay: -1.1s; 
  584.  -moz-animation-delay: -1.1s; 
  585.  animation-delay: -1.1s; 
  586. } 
  587. .cirBox1 .cir3 { 
  588.  -webkit-animation-delay: -0.8s; 
  589.  -moz-animation-delay: -0.8s; 
  590.  animation-delay: -0.8s; 
  591. } 
  592. .cirBox1 .cir4 { 
  593.  -webkit-animation-delay: -0.5s; 
  594.  -moz-animation-delay: -0.5s; 
  595.  animation-delay: -0.5s; 
  596. } 
  597. .cirBox2 .cir2 { 
  598.  -webkit-animation-delay: -1s; 
  599.  -moz-animation-delay: -1s; 
  600.  animation-delay: -1s; 
  601. } 
  602. .cirBox2 .cir3 { 
  603.  -webkit-animation-delay: -0.7s; 
  604.  -moz-animation-delay: -0.7s; 
  605.  animation-delay: -0.7s; 
  606. } 
  607. .cirBox2 .cir4 { 
  608.  -webkit-animation-delay: -0.4s; 
  609.  -moz-animation-delay: -0.4s; 
  610.  animation-delay: -0.4s; 
  611. } 
  612. .cirBox3 .cir2 { 
  613.  -webkit-animation-delay: -0.9s; 
  614.  -moz-animation-delay: -0.9s; 
  615.  animation-delay: -0.9s; 
  616. } 
  617. .cirBox3 .cir3 { 
  618.  -webkit-animation-delay: -0.6s; 
  619.  -moz-animation-delay: -0.6s; 
  620.  animation-delay: -0.6s; 
  621. } 
  622. .cirBox3 .cir4 { 
  623.  -webkit-animation-delay: -0.3s; 
  624.  -moz-animation-delay: -0.3s; 
  625.  animation-delay: -0.3s; 
  626. } 
  627. @-webkit-keyframes cir_Animation { 
  628.  0%, 
  629.  80%, 
  630.  100% { 
  631.   -webkit-transform: scale(0.4); 
  632.  } 
  633.  40% { 
  634.   -webkit-transform: scale(1); 
  635.  } 
  636. } 
  637. @-moz-keyframes cir_Animation { 
  638.  0%, 
  639.  80%, 
  640.  100% { 
  641.   -webkit-transform: scale(0.4); 
  642.  } 
  643.  40% { 
  644.   -webkit-transform: scale(1); 
  645.  } 
  646. } 
  647. @-webkit-keyframes cir_Animation { 
  648.  0%, 
  649.  80%, 
  650.  100% { 
  651.   -webkit-transform: scale(0.4); 
  652.  } 
  653.  40% { 
  654.   -webkit-transform: scale(1); 
  655.  } 
  656. } 
  657. .mask { 
  658.  width: 100%; 
  659.  height: 100%; 
  660.  background-color: #000; 
  661.  opacity: .8; 
  662.  position: fixed; 
  663.  left: 0; 
  664.  top: 0; 
  665.  z-index: 1000; 
  666. } 

2、修改application/config.php里，默认跳转页面对应的模板文件

  1. // 视图输出字符串内容替换 
  2. 'view_replace_str'    => ['__STATIC__'=>'/static'], 
  3. // 默认跳转页面对应的模板文件 
  4. //'dispatch_success_tmpl' => THINK_PATH . 'tpl' . DS . 'dispatch_jump.tpl', 
  5. //'dispatch_error_tmpl'  => THINK_PATH . 'tpl' . DS . 'dispatch_jump.tpl', 
  6. 'dispatch_success_tmpl' => THINK_PATH . 'tpl' . DS .'default_jump.tpl', 
  7. 'dispatch_error_tmpl'  => THINK_PATH . 'tpl' . DS .'default_jump.tpl', 

3、在thinkphp/tpl目录下新建一个default_jump.tpl，代码如下：

  1. {__NOLAYOUT__}<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
  2. <html xmlns="http://www.w3.org/1999/xhtml"> 
  3. <head> 
  4.   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
  5.   <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> 
  6.   <title>跳转提示</title> 
  7.     <!--引入dialog.css样式--> 
  8.   <link rel="stylesheet" href="__STATIC__/css/dialog.css" rel="external nofollow" > 
  9.   <style type="text/css"> 
  10.         .system-message p{ text-align: center;} 
  11.         .system-message .jump{ padding-top: 10px} 
  12.         .system-message .jump a{ color: #333;} 
  13.         .system-message .jump-btn{margin-top: 40px} 
  14.         .system-message .jump-btn a{font-size: 16px;color: #fff;border-radius: 4px;background-color: #0d65a3;padding: 6px 16px;text-decoration: none;} 
  15.     </style> 
  16. </head> 
  17. <body> 
  18.   <div class="system-message"> 
  19.         <div id='animationTipBox'> 
  20.     <?php switch ($code) {?> 
  21.       <?php case 1:?> 
  22.             <!--成功-->     
  23.                 <div class='success'> 
  24.                   <div class='icon'> 
  25.                       <div class='icon_box'> 
  26.                           <div class='line_short'></div> 
  27.                           <div class='line_long'></div> 
  28.                       </div> 
  29.                   </div> 
  30.                     <div class='dec_txt'><?php echo(strip_tags($msg));?></div>                     
  31.                 </div> 
  32.       <?php break;?> 
  33.       <?php case 0:?> 
  34.             <!--错误--> 
  35.                 <div class='lose'> 
  36.                   <div class='icon'> 
  37.                       <div class='icon_box'> 
  38.                           <div class='line_left'></div> 
  39.                           <div class='line_right'></div> 
  40.                       </div> 
  41.                   </div> 
  42.                     <div class='dec_txt'><?php echo(strip_tags($msg));?></div>                     
  43.                 </div>                             
  44.       <?php break;?> 
  45.     <?php } ?> 
  46.             <p class="jump"> 
  47.                 页面自动<a id="href" href="<?php echo($url);?>" rel="external nofollow" >跳转</a> 等待时间： <b id="wait"><?php echo($wait);?></b> 
  48.             </p> 
  49.             <p class="jump-btn"><a id="href" href="<?php echo($url); ?>" rel="external nofollow" >点击跳转</a></p> 
  50.         </div>         
  51.   </div> 
  52.   <script type="text/javascript"> 
  53.     (function(){ 
  54.       var wait = document.getElementById('wait'), 
  55.         href = document.getElementById('href').href; 
  56.       var interval = setInterval(function(){ 
  57.         var time = --wait.innerHTML; 
  58.         if(time <= 0) { 
  59.           location.href = href; 
  60.           clearInterval(interval); 
  61.         }; 
  62.       }, 1000); 
  63.     })(); 
  64.   </script> 
  65. </body> 
  66. </html> 

注意：dialog.css的路径要根据你自己的网站来写。

Tags: success error

分享到：

相关文章

推荐文章

热门文章

最新评论文章