双色球单选代码

sqsqiushuo

已于 2024-05-13 15:51:46 修改

阅读量431

点赞数 3

文章标签： javascript css css3

于 2024-05-13 15:47:40 首次发布

本文链接：https://blog.csdn.net/sqsqiushuo/article/details/138806338

版权

双色球单选代码

<html>
  <head>
    <title>Kill Number Tool</title>
    <style>
      body {
        width: 375px;
        height: 667px;
      }
      /* button {
        width: 300%;
        height: 100px;
        font-size: 50px;
      } */
      .row {
        width: 700px;
        display: flex;
      }
      #red {
        width: 420px;
      }
      #blue {
        width: 420px;
      }
      .ball {
        width: 38px;
        display: inline-block;
        border: 1px solid gray;
        border-radius: 50%;
        line-height: 40px;
        text-align: center;
        margin:10px;
      }
      .redBall {
        background-color: red;
        color: #fff;
      }
      .blueBall{
        background-color: rgb(110, 185, 235);
        color: #fff;
      }
      #a36select7{
        width: 100px;
        height: 20px;
      }
    </style>
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
  </head>
  <body>
    <h1>Kill Number Tool</h1>
    <button id="a36select7">36 Select 7</button>
    <div id="red"></div>
    <div id="blue"></div>
    <div id="result"></div>
    <script>
      const button36 = document.getElementById("a36select7");
      button36.addEventListener("click", function () {
        let numbers = [];
        while (numbers.length < 7) {
          let number = Math.floor(Math.random() * 33) + 1;
          if (!numbers.includes(number)) {
            numbers.push(number);
          }
        }
        let special = Math.floor(Math.random() * 16) + 1;
        let data = Array(33);
        let html = "";
        $.each(data, function (index, value) {
          html += `<div class="ball ${
            numbers.indexOf(index + 1) > 0 ? "redBall" : ""
          }">${index + 1}</div>`;
        });
        $("#red").html(html);
        let data2 = Array(16);
        let html2 = "";
        $.each(data2, function (index, value) {
          html2 += `<div class="ball ${
            special===index + 1 ? "blueBall" : ""
          }">${index + 1}</div>`;
        });
        $("#blue").html(html2);
      });
    </script>
  </body>
</html>

在这里插入代码片