统计
  • 建站日期:2022-01-17
  • 文章总数:3104 篇
  • 评论总数:3147条
  • 分类总数:43 个
  • 最后更新:1天前

智能算术题验证跳转HTML代码

首页 综合教程 正文
广告

网站安全防护升级_智能算术题验证源码

给网站添加进站验证,这是一个需要回答正确算数题才能跳转到页面的单页应用,支持自定义要跳转的网址,代码完整无加密。

打开文件只需要找到(// 调用跳转函数)把前面的域名替换需要访问的域名或者是文件路径

关于代码加密;若需要代码加密的小伙伴可在本平台的在线工具大全找到js/html在线加密工具进行代码加密!

image.png

<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>在线算数丨进站验证题</title>
  <style>
    body {
      background-image: url('https://pic.rmb.bdstatic.com/bjh/user/53652596c408c8902df671bf4991e241.png');
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
      font-weight: bold;
      color: #333;
      background-size: cover;
    }

    .container {
      text-align: center;
      margin-top: 20%;
    }

    h1 {
      font-size: 36px;
      color: #fff;
      text-shadow: 0px 2px 2px rgba(0, 0, 0, 0.5);
    }

    label {
      display: block;
      font-size: 30px;
      margin-bottom: 10px;
    }

    input {
      padding: 15px;
      font-size: 24px;
    }

    button {
      padding: 10px 20px;
      margin-top: 10px;
      font-size: 24px;
      color: #fff;
      background-color: #007bff; /* 蓝色 */
      border: none;
      border-radius: 5px;
      cursor: pointer;
      transition: background-color 0.2s;
    }

    button:hover {
      background-color: #0056b3; /* 深蓝色 */
    }

    @media (max-width: 600px) {
      body {
        background-image: url('https://pic.rmb.bdstatic.com/bjh/user/f02de8247621b09d90dc062bfc8f41bb.png');
      }

      label {
        font-size: 24px;
      }

      input {
        font-size: 18px;
      }

      button {
        font-size: 18px;
        padding: 8px 16px;
      }
    }
    .question-label {
  color: #ff00ff; /* 靓丽的颜色,例如紫色 */
  animation: rainbow 2s linear infinite;

}

@keyframes rainbow {
  0% {
    color: #ff00ff;
  }
  14% {
    color: #00ff00;
  }
  28% {
    color: #0000ff;
  }
  42% {
    color: #ffff00;
  }
  57% {
    color: #ff0000;
  }
  71% {
    color: #00ffff;
  }
  85% {
    color: #ff8000;
  }
  100% {
    color: #ff00ff;
  }
}
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

.container {
  margin: 0;
  padding: 0;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.content {
  flex-grow: 1;
}

  </style>
</head>

<body>
  <div class="container">
    <h1>算对带你免费追剧啦!</h1>
    <form id="verification-form">
      <label id="question-label" class="question-label" for="answer">请回答下面的算术题:</label>
      <input type="text" id="answer" required>
      <br>
      <button type="submit">提交</button>
    </form>
  </div>

  <script>
    var question = null; // 存储当前题目

    // 生成加减法算术题
    function generateQuestion() {
      var num1 = Math.floor(Math.random() * 10) + 1;
      var num2 = Math.floor(Math.random() * 10) + 1;
      var operator = Math.random() < 0.5 ? '+' : '-';
      var questionText = num1 + operator + num2;
      var answer = operator === '+' ? num1 + num2 : num1 - num2;

      return {
        question: questionText,
        answer: answer
      };
    }

    // 显示题目
    function displayQuestion() {
      question = generateQuestion();
      var questionLabel = document.getElementById('question-label');
      questionLabel.textContent = '请回答下面的算术题:' + question.question;
    }

    // 验证算术题答案
    function verifyAnswer(event) {
      event.preventDefault();

      var userAnswer = parseInt(document.getElementById('answer').value, 10);

      if (userAnswer === question.answer) {
        alert('验证通过!');
        redirect('https://www.aybk.cn'); // 调用跳转函数
      } else {
        alert('验证失败,请重新回答!');
      }

      document.getElementById('verification-form').reset();
      displayQuestion();
    }

    // 页面跳转函数
    function redirect(url) {
      window.location.href = url;
    }

    // 初始化页面,显示第一个题目
    displayQuestion();

    // 监听表单提交事件
    document.getElementById('verification-form').addEventListener('submit', verifyAnswer);
  </script>
<div style="display: none">
<script type="text/javascript" src="https://js.users.51.la/21354177.js"></script>
    </div>
</body>

</html>

版权说明
文章采用: 《署名-非商业性使用-相同方式共享 4.0 国际 (CC BY-NC-SA 4.0)》许可协议授权。
版权声明:本站资源来自互联网收集,仅供用于学习和交流,请勿用于商业用途。如有侵权、不妥之处,请联系客服并出示版权证明以便删除!
如何反溯源隐藏自己的源IP防止溯源?
« 上一篇 10-04
八字排盘源码PHP和HTML版
下一篇 » 10-04

发表评论

  • 泡泡
  • 阿呆
  • 阿鲁
  • 蛆音娘
    没有更多评论了