h5⽹页⼩游戏php源码,H5组词⼩游戏源代码H5⼩游戏 篇⼀ 组词游戏
项⽬功能简介
词库功能，项⽬⽂件⾥配有csv格式的中⽂常⽤词组词库，每次随机抽取词语进⾏游戏
匹配消除功能，⾃动在词库中匹配选中词语并进⾏消除
选中动画以及消除动画，均由svg⽣成爆炸动画
智能提醒系统，10秒之后未作操作可提⽰单词
过关判定
## 核⼼代码展⽰链接描述
获取词库，根据csv⽂件
$.ajax({
url: './js/ck2.csv',
dataType: 'text'
}).done(successFunction);
// 回调函数
function successFunction(data) {
var allRows = data.split(/\r?\n|\r/);
for (var singleRow = 1; singleRow < allRows.length; singleRow++) {
if (allRows[singleRow].length === 2) {
var m = {
a: allRows[singleRow][0],
b: allRows[singleRow][2]
}
dataBase.push(m)
}
}
}
随机抽取函数
会根据数组的长度获取随机数据
function getArrayItems(arr, num) {
//新建⼀个数组，将传⼊的数组复制过来,⽤于运算,⽽不要直接操作传⼊的数组;
var temp_array = new Array();
for (var index in arr) {
temp_array.push(arr[index]);
}
//取出的数值项，保存在此数组
var return_array = new Array();
for (var i = 0; i
//判断如果数组还有可以取出的元素，以防下标越界
if (temp_array.length>0) {
//在数组中产⽣⼀个随机索引
var arrIndex = Math.floor(Math.random()*temp_array.length);
//将此随机索引的对应的数组元素值复制出来
return_array[i] = temp_array[arrIndex];
//然后删掉此索引的数组元素，这时候temp_array变为新的数组
temp_array.splice(arrIndex, 1);
} else {
//数组中数据项取完后，退出循环,⽐如数组本来只有10项，但要求取出20项. break;
}
}
return return_array;
}
svg动画渲染插件
function clear(id) {
console.log(id,'-----------------')
bodymovin.loadAnimation({
container: ElementById(id), // 渲染动画的 dom 元素renderer: 'svg',
loop: false,
autoplay: true,
path: './js/data.json'
})
}
var vue = new Vue({
el: '#vue',
data: {
windowBg: false,
restart: false,
passNum: cn,
pass: 1,
grid: 9,
allText: null,
gridList: [],
text: '春天⾥柳树发芽百花',
one: null,
two: null,
reData: null,
timeDuring: 0
},
methods: {
// 重置函数
reStart () {
setTimeout(function () {
}, 800)
this.playAudio('restart')
this.passNum = cn
playAudio (val) {
var x = ElementById(val)
x.load()
x.play()
},
setTime () {
this.timeDuring++
if (this.timeDuring === 10) {
this.tip()
}
console.log(this.timeDuring)
setTimeout(function () {
vue.setTime()
}, 1000)
},
tip () {
let a = ''
console.log(choose)
if (!val.r && val.f) {
a = a + val.f
}
})
let b = null
choose.map(val => {
if (a.indexOf(val.a) !== -1 && a.indexOf(val.b) !== -1) { b = val.a
}
})
if (!b) {
}
if () {
this., 't')
}
if (!val.r && val.f === b) {php好看主页源码
< = null
this.choose(val, 't')
}
})
console.log(a)
},
// 选择函数
choose (item, type) {
if (type !== 't') {
this.timeDuring = 0
}
if (!item.f) {
return false
}
if ( && item.x === && item.y === ) { this.playAudio('touchCard')
item.choose = !item.choose
< = null
return false
} else {
this.playAudio('touchCard')
item.choose = !item.choose
if () {
this.two = item
// font()
// 模拟消除
// 加上timeout效果更好
var _this = this
setTimeout(function () {
_this.clearText()
}, 300)
} else {
< = item
// font()
}
}
},
// 消除逻辑
clearText () {
var r = false

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。