建站
咨询
售后
建站咨询
小程序实现留言板
本文实例为大家分享了小程序实现留言板的具体代码，供大家参考，具体内容如下
友谊ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景，ssl证书未来市场广阔！成为创新互联的ssl证书销售渠道，可以享受市场价格4-6折优惠！如果有意向欢迎电话联系或者加微信：18980820575（备注：SSL证书合作）期待与您的合作！
wxml
快速捎话：{{neirong}}
index.js
var nr = '';
Page({
/**
* 页面的初始数据
*/
data: {
msgData:
[
{
msg:
"泡澡水不要太热。"
},//双引号
{
msg:
"面部比较干，想补个水。"
},
{
msg:
"我只有2小时，您看着安排吧。"
},
{
msg:
"我想把眉毛在修下。"
},
{
msg:
"给我清个痘痘。"
},
{
msg:
"头疼，能轻点按。"
}
],
neirong: '',
},
clickMe: function (e) {
var that = this;
console.log(e);
nr = e.currentTarget.dataset.nr;
that.setData({
neirong: nr
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
wx.css
/*捎话wx.css */
.section{
width:96%;
height:220rpx;
margin-left:5px;
}
.message1{
width:96%;
height:210rpx;
margin-top: 30rpx;
font-size: 90%;
margin-left:20px;
}
.circle{
height:35rpx;
width:35rpx;
border-radius: 50%;
border: 1px solid #ccc;
display:inline-block;
margin:28rpx 45rpx auto 50rpx;
}
.fast{
position:relative;
top:-50rpx;
font-size:90%;
background:#f4f4f4;
line-height:100rpx;
text-indent:2em;
}
.item{
position:relative;
border-bottom:1px solid #f4f4f4;
padding-bottom:10px;
top: -60rpx;
}
.message_font{
font-size:80%;
font-family:"微软雅黑";
font-weight:blod;
display:inline-block;
position:relative;
top:-5rpx;
}
.submit{
width:100%;
height: 100rpx;
background: #fed1d6;
position: relative;
top:168rpx;
line-height: 100rpx;
}
button::after{
border:none;
}
但是上面的textarea还可以自由去编写，但是想实现在快速留言后面，再添加内容
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持创新互联。
当前名称：小程序实现留言板
文章链接：http://www.jxjierui.cn/article/jjigjs.html
