写在前面--这里我借鉴了一位博客的代码，可惜我忘记他的名字了，只能匿名地道声“谢谢！". 如果你看到了感觉我侵犯了你"版权"，可以告诉我，我会及时删除相关代码。我在借鉴这位朋友的代码基础上做了部分修改，实现本程序。我做了测试，可以保证绝对可以运行。后面也许我还会完善，增加更多功能。各位读者，如果你有兴趣继续修改，我表示赞同。我发布在这里，只是希望大家一起学习进步！

本程序一共3页，Page1：Index (在原来默认的工具建立的Index页的基础上改编而成）Page2：NoteEdit（我新建立的一页）Page3：Logs （完全是原来程序工具建立项目时默认生成的，我没有做任何修改，所以我不打算提供Logs的代码）

运行效果

Page1：

Page2

关于背景，你可以上百度搜索"手机壁纸"，选择几张图你喜欢的，as you like. 然后保存到 pagesimage里，改名为 111.jpg 和 222.jpg

Page1-- Index.mxml

!--背景--image class="des-image" src="{{image}}"/image!--底部滚动--scroll-view class="des-scr" scroll-y="true" bindscroll="scroll"  !--循环view--  block wx:for="{{desArr}}"    navigator url="../NoteEdit/NoteEdit?des={{item.des}}&time={{item.time}}&image={{image}}&id={{item.id}}&revise=1"      view class="des-view"  bindtap="toiletDetails" id="{{index}}"        text class="des-text"{{item.des}}/text        text class="des-tiemText"{{item.time}}/text      /view    /navigator  /block/scroll-view!--添加按钮--navigator url="../logs/logs?des=&time=2017-01-09&image={{image}}&id=-1&revise=0"    button class="new-btn"  bindtap="newBtnDown"+/button/navigator

Page1-- Index.wxss

page{  height: 100%;} .des-image{  position:absolute;  width: 100%;  height: 100%;} .des-scr{  width: 100%;  height: 100%;} .des-view{  margin: 5%;  width: 90%;  height: 180rpx;  border:1px solid orange;} .des-text{    display: block;    margin:20rpx;    height: 80rpx;    overflow: hidden;} .des-tiemText{  display: block;  margin-right: 20rpx;  margin-bottom: 20rpx;  height: 40rpx;  text-align: right;} .new-btn{  position:absolute;  bottom: 200rpx;  right: 0rpx;  width: 80rpx;  height: 80rpx;  background: darkorange;  border-radius: 50%;  font-size: 48rpx;  line-height:80rpx;}

Page1-- Index.js

//index.js//获取应用实例const app = getApp()Page({  data: {    today: '',//当天日期    image: '/pages/image/111.jpg',//背景图片    desArr: []//数据源数组  },  //Zha: 取得时间日期信息  getNowFormatDate() {    //获取当天日期    var date = new Date();    var seperator1 = "-";    var month = date.getMonth() + 1;    var strDate = date.getDate();    if (month = 1 && month = 9) {      month = "0" + month;    }    if (strDate = 0 && strDate = 9) {      strDate = "0" + strDate;    }    var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate    return currentdate;  },  //Zha: 点击进入添加note的详细界面  newBtnDown() {    //跳转页面到 NoteEdit    wx.navigateTo({      url: '../NoteEdit/NoteEdit'    })  },    onLoad: function (options) {    //-监听页面加载    //获取缓存内容    this.setData({      desArr: wx.getStorageSync('oldText')    })    if (this.data.desArr == null && this.data.desArr == '') {      //如果没有缓存则为空      this.setData({        desArr: []      })    }    //获取当天日期    var day = this.getNowFormatDate()    this.setData({      today: day    })  },  onShow: function () {    // 生命周期函数--监听页面显示       //获取当前缓存    var arrayA = wx.getStorageSync('oldText');    var isChange = wx.getStorageSync('isChange');    if (arrayA.length != this.data.desArr.length) {      //如果数量改变从新赋值      this.setData({        desArr: arrayA      })    } else if (isChange == 1) {      wx.setStorageSync('isChange', 0);      this.setData({        desArr: arrayA      })    }  },  onShareAppMessage: function () {    // 用户点击右上角分享    return {      title: '文笔记+', // 分享标题      desc: '我们的功能不仅笔记', // 分享描述      path: 'path' // 分享路径    }  },  cancelTap(e) {    //删除按钮    console.log(e)  }})

Page2-- NoteEdit.wxml

!--背景-- image class="the-image" src="{{image}}"/image !--按钮--text class="the-text"{{time}}/textbutton class="the-btn" bindtap="btnDown"保存/button !--输入框--view class="the-view"  textarea class= "the-textarea"  bindinput="bindTextAreaBlur" style="  margin: 5%;width: 90%;height: 90%" auto-focus value="{{des}}"maxlength="-1" cursor-spacing="0"  /textarea/view

Page2-- NoteEdit.wxss

/* pages/NoteEdit/NoteEdit.wxss */page{  height: 100%;} .the-image{  position:absolute;  width: 100%;  height: 100%;} .the-text{  position:absolute;  left: 5%;  top: 3.5%;  font-size: 28rpx;  text-align: left;} .the-btn{  font-size: 24rpx;  position:absolute;  right: 5%;  top: 2%;  height: 5%;  width: 20%} .the-view{  position:absolute;  top: 7%;  width: 100%;  height: 86%;} .the-textarea{  overflow:hidden;}

Page({  data: {    time: '',//日期    image: '/pages/image/222.jpg',//背景    textAreaDes: '',//输入的内容    revise: '',//是不是修改    id: ''  },  btnDown() {    //保存按钮    if (this.data.textAreaDes.length == 0) {      return;    }    //获取本地缓存    var oldText = wx.getStorageSync('oldText');    if (oldText != null && oldText != '') {      if (this.data.revise == '1') {        //如果是修改的，循环缓存数组，找到相应id更改        console.log(oldText)        for (var i = 0; i  oldText.length; i++) {          var dic = oldText[i];          if (dic.id == this.data.id) {            oldText[i] = { 'des': this.data.textAreaDes, time: dic.time, 'id': dic.id };            console.log(oldText)            //存入缓存            wx.setStorageSync('oldText', oldText);            wx.setStorageSync('isChange', 1);            return;          }        }      } else {        //记录是内容的id        var numID = wx.getStorageSync('oldTextID');        if (numID == this.data.id) {          return;        }        //添加更多缓存        oldText.push({ 'des': this.data.textAreaDes, time: this.data.time, 'id': numID });        //id自增        numID++;        wx.setStorageSync('oldTextID', numID);        this.setData({          id: numID        })      }    } else {      //如果没有缓存      oldText = [{ 'des': this.data.textAreaDes, time: this.data.time, 'id': 0 }];      //保存id      wx.setStorageSync('oldTextID', 1);      this.setData({        id: 1      })    }    //存入缓存    wx.setStorageSync('oldText', oldText);  },  bindTextAreaBlur(e) {    //当输入的文字改变走这个方法    //记录输入的文字       this.setData({      textAreaDes: e.detail.value    })  },  onLoad: function (options) {    // 生命周期函数--监听页面加载    this.setData({      des: options.des,      time: options.time,      image: options.image,      revise: options.revise,      id: options.id    })  },  onShareAppMessage: function () {    // 用户点击右上角分享    return {      title: '文笔记+', // 分享标题      desc: '爱的再多也记录不够', // 分享描述      path: 'path' // 分享路径    }  }})