前端的一些小知识

项目前端是easyui+jquery

1.现在要显示时 如果一个列的值大于150，这个列的左边就要变成1

如果这个列的值小于150 ，这个列的左边就要变成0.5

<th data-options="field:'PART_FULL_TIME',width:100,sortable : true" formatter='day_formatter'>半日/全日</th>

我们需要做的就是需要将值变换的这一列设置一个formatter函数，直接用return 返回列值//租车日期
    function day_formatter(value, row, index){
        var arr = $('#expenseReport').datagrid('getData');
        var data = row.RENTAL_FEE;
        if (data >= 150 )
            return 1;
        else if(data != null && data <150)
            return 0.5;
    }

row是这一列所有的值，在页面的类型为object，index是此列所在的列数。（第一列的index为0）

easyui 中，由于row参数已经是object类型，某一列的field为RENTAL_FEE,所以，直接row.RENTAL_FEE即可得到数据

在field为'PART_FULL_TIME'的这一列，直接return 0.5 或者 1 ，返回的是数字类型

这里我没有确切的查看api，只是猜测，因为之前返回的值可以直接和数字类型的对比

如果说返回的是  return ‘0.5’或者 ’1’，如果说返回值上加上了引号，那么就不是数字类型了。

2、然后并没有什么卵用，因为需求不是页面显示这样的，而是要在编辑的时候在一个表单中，如果租费输入框的值大于150，整日/半日 radio输入框就要自动选择成整日，反之半日。

暂时有两种办法做，一个是 输入租费之后失去焦点，让radio的属性值变化，一个是下一列输入时得到焦点，让radio的属性值变化。

经过测试，blur函数，会有延迟（项目前端之前已经做过了这样的效果，下一个输入框得到焦点，租费框才能真正有值），得不到想要的结果，所以说我们使用focus函数。

$("input[name='takeOrderQuantity']").focus(function(){
    if($("input[name='rentalFee']").val() >= 150){
        $("input[name='partFullTime'][value='0.5']").removeAttr("checked"); 
        $("input[name='partFullTime'][value='1']").prop("checked",true); 
    }
    else if($("input[name='rentalFee']").val() < 150){
        $("input[name='partFullTime'][value='1']").removeAttr("checked"); 
        $("input[name='partFullTime'][value='0.5']").prop("checked",true); 
    }
});

$("input[name='takeOrderQuantity']")这是下一个完全无关的输入框，现在拿它做一个触发函数

当然了，这里也要稍微注意一下jquery的格式来获取输入框的值

$("input[name='partFullTime'][value='1']").prop("checked",true);

这一行代码是让radio的后一个选中

注意：

这里为什么不用attr(“checked”,true)？

因为测试之后发现 radio不能重复变化，也就是说，前两次数值变化，radio的选中值也能变化

但是后面再变radio就没反应了

所以这里使用prop函数。

ok，一大早过来赶紧把昨天的东西记录一下。mark一户可以复习

转载于:https://my.oschina.net/u/2275839/blog/470000