HTML、JavaScript 、Vue之【数独解密】（续上一篇）

最新推荐文章于 2024-06-11 11:45:11 发布

LiLi_code

最新推荐文章于 2024-06-11 11:45:11 发布

阅读量374

点赞数

分类专栏： Vue Html 数独文章标签： javascript html vue.js

本文链接：https://blog.csdn.net/LiLi_code/article/details/104597830

版权

一、页面展示

（1）页面中的空格为input，方便输入数据，数据通过使用Vue实现双向动态绑定

（2）任意填入数据

（3）点击【解密】，即解出数独答案（当然我这里是让程序计算出一种结果便结束的

二、代码展示

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数独</title>
    <script type="text/javascript" src="../Import/vue.js"></script> <!--在上-->
    <link rel="stylesheet" href="../Import/element-ui-index.css">
    <script type="text/javascript" src="../Import/element-ui-index.js"></script>
    <style>
        li {
            list-style: none;
        }
        .el-input__inner {
            border-radius: 0;
        }
    </style>
</head>
<body>
<div id="app">
    <ul>
        <h2 style="margin-left: 155px">数独解密</h2>
        <li v-for="(value,i) in items.length">
            <span v-for="(item,j) in items[i]" @click="changeNum(i,j)">
                <el-input class="ano" v-model="items[i][j]" maxlength="1"
                          style="width: 45px;font-size: 20px;text-align: center;cursor: pointer"></el-input&g

最低0.47元/天解锁文章

LiLi_code

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
HTML、JavaScript 、Vue之【数独解密】（续上一篇）

一、页面展示（1）页面中的空格为input，方便输入数据，数据通过使用Vue实现双向动态绑定（2）任意填入数据（3）点击【解密】，即解出数独答案（当然我这里是让程序计算出一种结果便结束的二、代码展示<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-...
复制链接

扫一扫