MUI批量绑定事件的实际应用场景

简单介绍一下需求

获取到多选表单中选中的项，然后将选项生成各个按钮，点击各个按钮弹出不同的模板子页面，编辑子页面的表单内容。

这里我选择了5项，所以生成了5个按钮：

具体需求是：生成的几个按钮需要点击对应的按钮弹出对应的子页面填充子页面数据。

这时候MUI的批量绑定事件就派上用场了：

//模板URL集合
var urls = {
    "植株高度": "../templates/addPlantHeight.html",
    "SPAD": "../templates/addSPAData.html",
    "含水量":  "../templates/addMoisture.html",
    "叶片重量": "../templates/addLeafWeight.html",
    "叶面积指数": "../templates/addLeafArea.html",
    "穗长": "../templates/addEarLength.html"
};

//根据按钮的指定打开对应模板页面
mui('.mui-content').on('tap', '.sampbtn', function(){
    console.log("=="+this.innerText);
    childPage = plus.webview.create(urls[this.innerText], urls[this.innerText], childPagePara);
    childPage.addEventListener("loaded", function() {
        childPage.show('fade-in', 300);
        childPage = null;
        }, false);
})

最终就可以实现批量绑定按钮事件，绑定点击事件打开指定的模板页面。