本文实例为大家分享了微信小程序实现点击页面地方出现文字的具体代码，供大家参考，具体内容如下效果图如下所示.wxml



{{text_a}}


{{text_b}}


{{text_c}}


{{text_d}}


{{text_e}}


{{text_f}}


{{text_g}}


{{text_h}}


{{text_i}}


{{text_j}}




{{text_a}}


{{text_b}}


{{text_c}}


{{text_d}}


{{text_e}}


{{text_f}}


{{text_g}}


{{text_h}}


{{text_i}}


{{text_j}}
.wxss
.index{
width: 100%;
float: left;
height: 100vh;
background-color: #ffcccc;
}
.text{
position: absolute;
transition: all 1s;
font-size: 26rpx;
z-index: 9999;
}
.index{
width: 100%;
float: left;
height: 100vh;
background-color: #ffcccc;
}
.text{
position: absolute;
transition: all 1s;
font-size: 26rpx;
z-index: 9999;
}.js
Page({
data: {
index:0,
},
index:function(e){
let that = this
let array = ["富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业"]
that.data.index = array.length == that.data.index ? 0 :that.data.index
that.setData({
index: that.data.index + 1,
})
let x = e.detail.x + 8
let y = e.detail.y - 40
if (that.data.index == 1 && !that.data.text_a){
that.setData({
text_a: array[that.data.index - 1],
text_ax: x,
text_ay: y,
opacity_a: 1,
})
let timer_a = setInterval(function () {
that.setData({

opacity_a: 0,

text_ay: y - 60,
})
setTimeout(function () {

that.setData({

text_a: '',

})
}, 1000)
clearInterval(timer_a);
}, 200)
return false;
}
if (that.data.index == 2 && !that.data.text_b) {
that.setData({
text_b: array[that.data.index - 1],
text_bx: x,
text_by: y,
opacity_b: 1,
})
let timer_b = setInterval(function () {
that.setData({

opacity_b: 0,

text_by: y - 60,
})
setTimeout(function () {

that.setData({

text_b: '',

})
}, 1000)
clearInterval(timer_b);
}, 200)
return false
}
if (that.data.index == 3 && !that.data.text_c) {
that.setData({
text_c: array[that.data.index - 1],
text_cx: x,
text_cy: y,
opacity_c: 1,
})
let timer_c = setInterval(function () {
that.setData({

opacity_c: 0,

text_cy: y - 60,
})
setTimeout(function () {

that.setData({

text_c: '',

})
}, 1000)
clearInterval(timer_c);
}, 200)
return false
}
if (that.data.index == 4 && !that.data.text_d) {
that.setData({
text_d: array[that.data.index - 1],
text_dx: x,
text_dy: y,
opacity_d: 1,
})
let timer_d = setInterval(function () {
that.setData({

opacity_d: 0,

text_dy: y - 60,
})
setTimeout(function () {

that.setData({

text_d: '',

})
}, 1000)
clearInterval(timer_d);
}, 200)
return false
}
if (that.data.index == 5 && !that.data.text_e) {
that.setData({
text_e: array[that.data.index - 1],
text_ex: x,
text_ey: y,
opacity_e: 1,
})
let timer_e = setInterval(function () {
that.setData({

opacity_e: 0,

text_ey: y - 60,
})
setTimeout(function () {

that.setData({

text_e: '',

})
}, 1000)
clearInterval(timer_e);
}, 200)
return false
}
if (that.data.index == 6 && !that.data.text_f) {
that.setData({
text_f: array[that.data.index - 1],
text_fx: x,
text_fy: y,
opacity_f: 1,
})
let timer_f = setInterval(function () {
that.setData({

opacity_f: 0,

text_fy: y - 60,
})
setTimeout(function () {

that.setData({

text_f: '',

})
}, 1000)
clearInterval(timer_f);
}, 200)
return false
}
if (that.data.index == 7 && !that.data.text_g) {
that.setData({
text_g: array[that.data.index - 1],
text_gx: x,
text_gy: y,
opacity_g: 1,
})
let timer_g = setInterval(function () {
that.setData({

opacity_g: 0,

text_gy: y - 60,
})
setTimeout(function () {

that.setData({

text_g: '',

})
}, 1000)
clearInterval(timer_g);
}, 200)
return false
}
if (that.data.index == 8 && !that.data.text_h) {
that.setData({
text_h: array[that.data.index - 1],
text_hx: x,
text_hy: y,
opacity_h: 1,
})
let timer_h = setInterval(function () {
that.setData({

opacity_h: 0,

text_hy: y - 60,
})
setTimeout(function () {

that.setData({

text_h: '',

})
}, 1000)
clearInterval(timer_h);
}, 200)
return false
}
if (that.data.index == 9 && !that.data.text_i) {
that.setData({
text_i: array[that.data.index - 1],
text_ix: x,
text_iy: y,
opacity_i: 1,
})
let timer_i = setInterval(function () {
that.setData({

opacity_i: 0,

text_iy: y - 60,
})
setTimeout(function () {

that.setData({

text_i: '',

})
}, 1000)
clearInterval(timer_i);
}, 200)
return false
}
if (that.data.index == 10 && !that.data.text_j) {
that.setData({
text_j: array[that.data.index - 1],
text_jx: x,
text_jy: y,
opacity_j: 1,
})
let timer_j = setInterval(function () {
that.setData({

opacity_j: 0,

text_jy: y - 60,
})
setTimeout(function () {

that.setData({

text_j: '',

})
}, 1000)
clearInterval(timer_j );
}, 200)
return false
}
},
})
Page({
data: {
index:0,
},
index:function(e){
let that = this
let array = ["富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业"]
that.data.index = array.length == that.data.index ? 0 :that.data.index
that.setData({
index: that.data.index + 1,
})
let x = e.detail.x + 8
let y = e.detail.y - 40
if (that.data.index == 1 && !that.data.text_a){
that.setData({
text_a: array[that.data.index - 1],
text_ax: x,
text_ay: y,
opacity_a: 1,
})
let timer_a = setInterval(function () {
that.setData({

opacity_a: 0,

text_ay: y - 60,
})
setTimeout(function () {

that.setData({

text_a: '',

})
}, 1000)
clearInterval(timer_a);
}, 200)
return false;
}
if (that.data.index == 2 && !that.data.text_b) {
that.setData({
text_b: array[that.data.index - 1],
text_bx: x,
text_by: y,
opacity_b: 1,
})
let timer_b = setInterval(function () {
that.setData({

opacity_b: 0,

text_by: y - 60,
})
setTimeout(function () {

that.setData({

text_b: '',

})
}, 1000)
clearInterval(timer_b);
}, 200)
return false
}
if (that.data.index == 3 && !that.data.text_c) {
that.setData({
text_c: array[that.data.index - 1],
text_cx: x,
text_cy: y,
opacity_c: 1,
})
let timer_c = setInterval(function () {
that.setData({

opacity_c: 0,

text_cy: y - 60,
})
setTimeout(function () {

that.setData({

text_c: '',

})
}, 1000)
clearInterval(timer_c);
}, 200)
return false
}
if (that.data.index == 4 && !that.data.text_d) {
that.setData({
text_d: array[that.data.index - 1],
text_dx: x,
text_dy: y,
opacity_d: 1,
})
let timer_d = setInterval(function () {
that.setData({

opacity_d: 0,

text_dy: y - 60,
})
setTimeout(function () {

that.setData({

text_d: '',

})
}, 1000)
clearInterval(timer_d);
}, 200)
return false
}
if (that.data.index == 5 && !that.data.text_e) {
that.setData({
text_e: array[that.data.index - 1],
text_ex: x,
text_ey: y,
opacity_e: 1,
})
let timer_e = setInterval(function () {
that.setData({

opacity_e: 0,

text_ey: y - 60,
})
setTimeout(function () {

that.setData({

text_e: '',

})
}, 1000)
clearInterval(timer_e);
}, 200)
return false
}
if (that.data.index == 6 && !that.data.text_f) {
that.setData({
text_f: array[that.data.index - 1],
text_fx: x,
text_fy: y,
opacity_f: 1,
})
let timer_f = setInterval(function () {
that.setData({

opacity_f: 0,

text_fy: y - 60,
})
setTimeout(function () {

that.setData({

text_f: '',

})
}, 1000)
clearInterval(timer_f);
}, 200)
return false
}
if (that.data.index == 7 && !that.data.text_g) {
that.setData({
text_g: array[that.data.index - 1],
text_gx: x,
text_gy: y,
opacity_g: 1,
})
let timer_g = setInterval(function () {
that.setData({

opacity_g: 0,

text_gy: y - 60,
})
setTimeout(function () {

that.setData({

text_g: '',

})
}, 1000)
clearInterval(timer_g);
}, 200)
return false
}
if (that.data.index == 8 && !that.data.text_h) {
that.setData({
text_h: array[that.data.index - 1],
text_hx: x,
text_hy: y,
opacity_h: 1,
})
let timer_h = setInterval(function () {
that.setData({

opacity_h: 0,

text_hy: y - 60,
})
setTimeout(function () {

that.setData({

text_h: '',

})
}, 1000)
clearInterval(timer_h);
}, 200)
return false
}
if (that.data.index == 9 && !that.data.text_i) {
that.setData({
text_i: array[that.data.index - 1],
text_ix: x,
text_iy: y,
opacity_i: 1,
})
let timer_i = setInterval(function () {
that.setData({

opacity_i: 0,

text_iy: y - 60,
})
setTimeout(function () {

that.setData({

text_i: '',

})
}, 1000)
clearInterval(timer_i);
}, 200)
return false
}
if (that.data.index == 10 && !that.data.text_j) {
that.setData({
text_j: array[that.data.index - 1],
text_jx: x,
text_jy: y,
opacity_j: 1,
})
let timer_j = setInterval(function () {
that.setData({

opacity_j: 0,

text_jy: y - 60,
})
setTimeout(function () {

that.setData({

text_j: '',

})
}, 1000)
clearInterval(timer_j );
}, 200)
return false
}
},
})为大家推荐现在关注度比较高的微信小程序教程一篇：《微信小程序开发教程》小编为大家精心整理的，希望喜欢。《微信小程序开发教程》以上就是本文的全部内容，希望对大家的学习有所帮助。