前端随手记

整理下之前写前端页面一些问题。
之前在公司里使用的都是公司自研的前端fish框架，感觉JS部分和vue差不多。
布局、控件和控件方法都是看api文档，这里主要记录下框架不支持的东西，即使用原生JS技术解决方案。

---

提示：以下是本篇文章正文内容，下面案例可供参考

1. ajax回调函数内部无法修改外部变量。

如：前端发送ajax请求给后台需要查询该用户是否有审核权限，因此需要定义一个全局变量，将后台查询结果赋值给这个变量，在进行审核的时候对该变量进行判断，如果有审核权限，则允许该用户进行后续操作。
但是在ajax回调函数内部无法修改外部变量，此时需要将ajax请求由异步请求改为同步请求，才会对全局变量赋值成功。

            $.ajaxSetup({
                async: false
            });
            $.post('/interface/execute/sql', {
                sqlId: '35334',
                sqlType: '2',
                sqlParamJson: JSON.stringify({
                    staffId:session.staff.staffId
                })
            }, function (retList) {
                retList = JSON.parse(retList);
                if(retList.length>0){
                    isRole=true;
                }
            });
            $.ajaxSetup({
                async: true
            });

此处请求的这个接口是公司大牛开发的一个适配oracle，MysqL等数据库的通用sql执行接口，只需要在数据库配置表里写sql即可，不需要后台用代码写SQL查询语句了，非常方便。后续可以自己参照其写一个锻炼锻炼。

二、 利用window.open在页面件传递对象，数组变量

在当前页面点击详情打开新的页面，而新的页面加载需要当前页中的某些数据，公司前端框架只支持弹出小的对话框这种的传值，不支持打开新的页面传值。下面使用window.open进行操作。

当前页

showListInfo: function(rowid,faultType){
            var data = this.$("#faultGrid").grid('getRowData', rowid);
            data.startTime = me.$('#startTime').val();
            data.endTime = me.$('#endTime').val();
            data.faultType=faultType;
            window.rowData= data;
            window.open('/webnet/views/faultListView');
}

新页面读取上一页面传递的数据

console.log(window.opener.rowData)

三、选择器

记录一个复杂选择器的写法，基本上选择器的用法都用上了，下次再写的时候可以参照。

var orderId=$("#e_subAlarm div[class='datagrid-body'] table tr[class*='datagrid-row-selected']:eq(1) td[field='orderId'] > div").text();		

四、JS生成随机汉字

function getHanZi() {
    var str='秦时明月汉时关万里长征人未还但使龙城飞将在不教胡马渡阴山烟里丝丝弄碧曾见几番拂水飘绵送行色登临望故国谁识京华倦客长亭路年去岁来应折柔条过千尺闲寻旧踪迹又酒趁哀弦灯照离席梨花榆火催寒食愁一箭风快半篙波暖回头迢递便数驿望人在天北凄恻恨堆积渐别浦萦回津堠岑寂斜阳冉冉春无极念月榭携手露桥闻笛沉思前事似梦里泪暗滴';
    let strings = str.split("");
    return strings[Math.floor(Math.random() * strings.length)];
}