javascript实现九宫格相加数值相等
79 浏览量
2020-11-22
20:41:17
上传
评论
收藏 89KB PDF 举报
javascript实现九宫格相加数值相等实现九宫格相加数值相等
本文实例介绍了javascript实现九宫格的对应方法，分享给大家供大家参考，具体内容如下
实现思路：
1、每个格子输入的数值必须为数字；
2、输入数值不能重复；
3、输入数值不能小于1或大于9；
4、数值不能为空；
5、相加方式共8个，分别为横向三个、纵向三个、两条对角线两个值。详情如下：
解释：解释：
以每个格子所标记序号为标识：
横向三个值：0-2，3-4，6-8；
纵向三个值：[0,3,6]、[1,4,7]、[2,5,8]；
对角线两个值：[0,4,8]、[2,4,6]
实现过程：实现过程：
很简单，和上面图片一样，点击提交按钮开始判断。
1、布局、布局
html部分：
<div class="box">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<input type="text">
<button>提交</button>
</div>
css部分：通过css3中属性实现。
*{margin:0;padding:0;outline: none;}
html,body{
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.box{
position: relative;
width: 250px;
margin:0 auto;
}
评论0
最新资源