$(function (){
window.onload = function () {
var tfrow = document.getElementById('tfhover').rows.length;
var tbRow = [];
for (var i = 1; i < tfrow; i++) {
tbRow[i] = document.getElementById('tfhover').rows[i];
tbRow[i].onmouseover = function () {
this.style.backgroundColor = '#ffffff';
};
tbRow[i].onmouseout = function () {
this.style.backgroundColor = '#d4e3e5';
};
}
};
let xx = ['3,1,0']
let html = ''
xx.forEach((item,index)=>{
html += `<tr>
<td>${item}</td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="0" min="0"></td>
<td><input type="number" value="" min="0"></td>
<td><input type="number" value="" min="0"></td>
<td><input type="number" value="" min="0"></td>
<td><input type="number" value="" min="0"></td>
<td><input type="number" value="" min="0"></td>
</tr>`
})
$('.tftable').append(html)
let data = {}
$('.result').click(function (){
$('#resData tr').not(':first').remove();
$('tbody tr').each(function (idx1){
if(idx1>0){
let dt = []
$(this).find('td').each(function (idx2){
if(idx2>0){
dt.push({
key:idx2-1,
value:$(this).find('input').val()
})
}
})
data['row'+idx1] = dt
}
})
var inputData = data.row1
let emptyLocator =[];
inputData.map((item,index) => {
if(item.value === ''){
return emptyLocator.push(index)
}
})
let deleteEmpty =[];
deleteEmpty = inputData.filter(item => item.value !== '')
deleteEmpty.forEach((item1,index1) => {
item1.key2 = index1
})
// console.log(deleteEmpty,'deleteEmpty')
if (deleteEmpty.length <9){
alert('最少输入九个值')
return false
}
console.log(deleteEmpty,inputData,321)
let combination = cmn(deleteEmpty, 9)
let gNewArr = []
combination.forEach((item1,index1) => {
gNewArr.push(getNewArr(item1,deleteEmpty))
})
// console.log(gNewArr,'gNewArr')
combination.forEach((item1,index1) => {
gNewArr.forEach((item3,index3) => {
if(index1 === index3){
item3.forEach((item4,index4) => {
item1.splice(item4.key2*1, 0, {
key:'kong',
value:'空'
});
})
}
})
})
combination.map((item1,index1) => { //指定位置插入值
emptyLocator.map((item3,index3) => {
item1.splice(item3, 0, {
key:'kong',
value:'空'
});
})
})
// console.log(combination,'combination')
$('#total').text(combination.length)
let html2 = ''
combination.forEach((item,index)=>{
html2 += `<tr>`
html2 += `<td class="number"><span>${index+1}.</span></td>`
item.forEach((item2,index2)=>{
html2 += `<td>
<span>${item2.value}</span>
</td>`
})
html2 += `</tr>`
})
$('.resData').append(html2)
})
function updateTime() {
var date = new Date()
var year = date.getFullYear()
var month = date.getMonth() + 1
var day = date.getDate()
var hours = date.getHours()
month = month < 10 ? "0" + month : month
day = day < 10 ? "0" + day : day
hours = hours < 10 ? "0" + hours : hours
return year+''+month+''+day+''+hours
}
//求：组合C(m, n)，m为上标，n为下标。m选n的所有项
function cmn(m, n, currentIndex = 0, choseArr = [], result = []) {
let mLen = m.length
if (currentIndex + n > mLen) {
return
}
for (let i = currentIndex; i < mLen; i++) {
if (n === 1) {
result.push([...choseArr, m[i]])
i + 1 < mLen && cmn(m, n, i + 1, choseArr, result)
break
}
cmn(m, n - 1, i + 1, [...choseArr, m[i]], result)
}
return result
}
/*筛选数组中不相同的值*/
function getNewArr(a,b){
const arr = [...a,...b];
return arr.filter(item => {
return !(a.includes(item) && b.includes(item));
});
}
})
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script src="http://code.jquery.com/jquery-1.4.1.min.js"></script>
<script src="tb2.js"></script>
</head>
<body>
<table id="tfhover" class="tftable" border="1">
<tr>
<th></th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
<th>10</th>
<th>11</th>
<th>12</th>
<th>13</th>
<th>14</th>
</tr>
</table>
<div class="result">点击获取 <span>总共<em id="total">0</em>条</span></div>
<div class="excel">导出Excel</div>
<table class="resData" id="resData">
<tr>
<th class="number">序号</th>
<th>1</th>
<th>2</th>
<th>3</th>
<th>4</th>
<th>5</th>
<th>6</th>
<th>7</th>
<th>8</th>
<th>9</th>
<th>10</th>
<th>11</th>
<th>12</th>
<th>13</th>
<th>14</th>
</tr>
</table>
<script type="text/javascript">
</script>
<style type="text/css">
html, body {
height: 100%;
}
body,
ul,
ol,
li,
p,
h1,
h2,
h3,
h4,
h5,
h6,
form,
fieldset,
table,
img,
div {
margin: 0;
padding: 0;
border: 0;
box-sizing: border-box;
}
body {
background: #fff;
color: #333;
font-size: 12px;
position: relative;
font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}
input {
outline: 0;
padding: 0 10px;
margin: 0;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
ul,
ol {
list-style-type: none;
}
table.tftable {
font-size: 12px;
color: #333333;
width: 100%;
border-width: 1px;
border-color: #729ea5;
border-collapse: collapse;
}
table.tftable th {
font-size: 12px;
background-color: #acc8cc;
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #729ea5;
text-align: left;
}
table.tftable tr {
background-color: #d4e3e5;
}
table.tftable td {
font-size: 12px;
border-width: 1px;
padding: 8px;
border-style: solid;
border-color: #729ea5;
}
table.tftable td input {
width: 100%;
}
.resData tr {
height: 50px;
}
.resData td, .resData th {
float: left;
width: 50px;
font-size: 20px;
text-align: center;
}
.resData td span {
font-size: 20px;
}
.resData .number {
margin-right: 20px;
}
.resData .number span {
color: #ea2d0e;
}
.result {
padding: 20px;
font-size: 20px;
}
.result span {
padding-left: 10px;
font-size: 16px;
color: #2e3243;
}
.result:hover{
color: #ea2d0e;
cursor: pointer;
}
.result em {
font-style: normal;
}
.excel {
font-size: 16px;
padding: 20px;
cursor: pointer;
}
.excel:hover{
color: #ea2d0e;
}
</style>
</body>
</html>
网友评论