HTML from表单只读状态设置和取消

1、问题

最近接个需求，使用的是springboot + Bootstrap + thymeleaf；页面中的新增和详情用的是一个表单，故而在查看详情时候需要将form表单设置成只读状态，首先想到的是 readonly 和 disable。
但是这种方法都是在input输入框中设置，我的字段比较多，所以比较麻烦，不适用。
而且我的需求中需要点击按钮就可以编辑（编辑按钮有权限才显示），而且disable时候多选变成了灰色，影响视觉。

2、解决办法

设置form表单的id属性。第一次进入页面中时候是只读状态。

使用js。

//  true 的时候就是只读
        $('#formId').find('input,textarea').attr('disabled',true);

// 编辑按钮
    function edit(){
    	// false时候就是可以正常编辑
        $('#formId').find('input,textarea').attr('disabled',false);
    }