Easyui 笔记

313 阅读1分钟

最近工作交接,顺便把自己在工作期间所做的笔记做个整理,方便自己在日后的工作中查找。

textarea、input H5/PC中实时监听

  • 写法1:【项目中用】
//文本框--实时监听-字数统计
$(function(){
    this.addListenTextareaChange();  //调用
});
/**
* 参数:
*	descriptionLen  字数计算的文本显示dom的id名
*	description		文本框dom的id名
*/
addListenTextareaChange: function(){
    //获取文本内容和长度函数
    function txtCount(el) {
        var val = el.value;
        var eLen = val.length;
        return eLen;
    }

    var el = document.getElementById('description');
    el.addEventListener('input',function () {
        var len =  txtCount(this); //   调用函数 
        document.getElementById('descriptionLen').innerHTML = len;
    });

    el.addEventListener('propertychange',function () {//兼容IE
        var len =  txtCount(this); //   调用函数 
        document.getElementById('descriptionLen').innerHTML = len;
    });
}
  • 写法2:
//评价--实时监听-字数统计
function addListenTextareaChange(){
   //获取文本内容和长度函数
   function txtCount(el) {
   var val = el.value;
   var eLen = val.length;
   return eLen;
}

var el = document.getElementById('description');
el.addEventListener('input',function () {
   var len =  txtCount(this); //   调用函数 
   document.getElementById('descriptionLen').innerHTML = len;
});

el.addEventListener('propertychange',function () {//兼容IE
     var len =  txtCount(this); //   调用函数 
     document.getElementById('descriptionLen').innerHTML = len;
 });
}

Easyui datagrid高度自适应---解决高度为0的问题

$('#tabId').datagrid('resize')

Easyui表单聚焦

top.showAlert(info,alertFn); //弹窗后聚焦

function alertFn(){
    if(Crowd.dom.inputId){
    var inputId = Crowd.dom.inputId;
    $('#'+inputId).numberbox('textbox').focus(); 
    }
}

表单

//下拉框--自适应高度
panelHeight:'auto' //值:auto 或 数字

//获取下拉框的值
var month = $("#month").combobox('getValue');

//下拉框赋值
$('#month').combobox('setValue', '001');

//echart 图标颜色值
color: ['#5A62AF','#F98686','#7095FF','#DA89FF','#FEB26F','#4FBEB5','#A6D367'],	

//easyui--下拉框--下拉列表数据请求
<select class="singleSelect easyui-combobox" style="width: 300px;" name="setMealId" id="setMeal" data-options="url:'setMeal/list',editable:false,valueField:'id', textField:'name',loadFilter:loadFilter,prompt:'请选择套餐'">
<!-- <option value="" selected>请选择套餐</option> -->
</select>

//easyui--开关按钮
<input id="sw_btn" class="easyui-switchbutton" data-options="onText:'', offText:'', width: 38, height: 20, handleWidth:20">
 

Easyui 表单的禁用与启用

$('#validStartDate').datebox({ disabled: true });
$('#validStartDate').datebox({ disabled: false });

$("#validDays").numberbox({disabled:false});

$("#fullMoney").numberbox("enable",true);
$("#fullMoney").numberbox("disable",true);

$('#text1').textbox('enable');// 启用
$('#text1').textbox('disable');// 禁用

$('#activityCode').combobox({ disabled: true });
$('#activityCode').combobox({ disabled: false });

//easyui  alert提示
$.messager.alert(WINDOW_CAPTION,'标签删除成功','info');   //WINDOW_CAPTION 弹窗标题名称

top.$.messager.alert(WINDOW_CAPTION, "标签保存成功", 'info');   //写法的方法