最近,加入了一个小项目,由浩哥带领我们几个人一起开发一个东西。幸运的是,我和胡志婷分到了一组,她可是一个具有丰富经验的牛人,对我也很好,哈哈。
——背景
说点正事,最近,我们在进行项目的时候,提到了一个需求,就是要动态的禁用或者是恢复
<input type="text" editor:"text"><span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"><span style="font-family: Arial, Helvetica, sans-serif; background-color: rgb(255, 255, 255);"></span></span>
的编辑功能,刚开始,找遍了整个easyui的使用手册,可是,还是没有什么收获,可是我没有放弃,终于就在刚刚,我解决了这个问题,展示如下:
function onClickRow(index) { if (editIndex != index) { if (endEditing()) { $('#dg').datagrid('selectRow', index) .datagrid('beginEdit', index); var cellEdit = $('#dg').datagrid('getEditor', { index: index, field: 'Quote' }); var $input = cellEdit.target; // 得到文本框对象 $input.val('aaa'); // 设值 $('input').attr("readonly","readonly" ); $input.prop('readonly', true); // 设值只读 editIndex = index; } else { $('#dg').datagrid('selectRow', editIndex); } //JSON.stringify(inserted); } }
看上去感觉也挺简单,可是,为啥自己就写不出来呢,经过整理,我了解到,要实现这个功能还有别的方法:
disabled
像这种,他禁用的只是一些id为btn的东西,只要我们的id不是btn,就不会受影响//禁用 id 为 btn 的按钮: $("#btn").attr({"disabled":"disabled"}); //或者 $("#btn").attr("disabled","disabled"); //取消禁用: $("#btn").removeAttr("disabled"); //或者 $("#btn").attr("disabled","");
readonly
$(‘input’).attr(“readonly”,”readonly”)//将input元素设置为readonly $(‘input’).removeAttr(“readonly”);//去除input元素的readonly属性 if($(‘input’).attr(“readonly”)==true)//判断input元素是否已经设置了readonly属性
而像这种,我们是把整个input全部设成只读属性,也就是说,本界面上,所有的<input >都不能再进行编辑修改了
总结:
我们学习到了知识,如果不用的话,会慢慢的烂在自己的心里,会慢慢的淡忘,所以,学到了,就要能用则用,多多锻炼自己,这样自己才能掌握的更加灵活,理解得更加深刻!
Jquery禁止/恢复按钮与文本框代码
程序员文章站
2022-03-04 15:57:09
...
下一篇: 输入文本框添加清空按钮与功能