菜鸡前端问题整理

CSS设置滚动条：

/*---滚动条默认显示样式--*/  
::-webkit-scrollbar-thumb{ 
   background-color:#77909D;  
   border-radius:6px;  
}  

/*---鼠标点击滚动条显示样式--*/  
::-webkit-scrollbar-thumb:hover{  
   background-color:#5F7580;  
   border-radius:6px;  
}  
/*---滚动条大小--*/  
::-webkit-scrollbar{  
   width:6px;  
   height:6px;  
}  
/*---滚动框背景样式--*/  
::-webkit-scrollbar-track-piece{   
   border-radius:0;  
}

jquery的$.extend()、$.fn和$.fn.extend()

jQuery.fn = jQuery.prototype = { 　　　init: function( selector, context ) {//…. //…… };

//$.fn表示jquery的对象增加方法（$("#id").test()）
//给jQuery中的每个实例加方法
$.fn.test = function () {
 alert($(this).text());
}

jQuery.extend(object)

//C#中每个对象都有自己的方法，但是也有静态方法啊， $.extend就来了

//加静态方法
jQuery.extend({
max:(a,b)=> { return a>b?a:b; },
min:(a,b)=> { return a<b?a:b; },
});

//调用 $.max(1,2)=>2

Objectj Query.extend( target, object1, [objectN])

//用一个或多个其他对象来扩展一个对象，返回被扩展的对象

var settings = { validate: false, limit: 5, name: "foo" };

var options = { validate: true, name: "bar" };

jQuery.extend(settings, options);

结果：settings == { validate: true, limit: 5, name: "bar" }

jQuery.fn.extend(object);

//对jQuery.prototype进得扩展，就是为jQuery类添加“成员函数”。

//jQuery类的实例可以使用这个“成员函数”。 比如我们要开发一个插件，做一个特殊的编辑框，当它被点击时，便alert 当前编辑框里的内容。可以这么做：

$.fn.extend({ alertWhileClick:function() {

$(this).click(function(){ alert($(this).val());

});

} });

$("#input1").alertWhileClick();

jQuery.fn.extend = jQuery.prototype.extend

你可以拓展一个对象到jQuery的 prototype里去，这样的话就是插件机制了。

(function( $ ){ $.fn.tooltip = function( options ) { };

//等价于

var tooltip = { function(options){ } }; $.fn.extend(tooltip) = $.prototype.extend(tooltip) = $.fn.tooltip })( jQuery );

　//jQuery.fn.extend = jQuery.prototype.extend,目前这种方法还没用过，所以我也不是很了解，理解jquery的$.extend()、$.fn和$.fn.extend(),这篇博客写的还是比较全的

js中的箭头函数

(参数1, 参数2, …, 参数N) => { 函数声明 }
(参数1, 参数2, …, 参数N) => 表达式（单一）
//相当于：(参数1, 参数2, …, 参数N) =>{ return 表达式; }

// 当只有一个参数时，圆括号是可选的：
(单一参数) => {函数声明}
单一参数 => {函数声明}

// 没有参数的函数应该写成一对圆括号。
() => {函数声明}

　就相当于C#中的lambda实现委托的方法；但是目前箭头函数是ES6的语法，就像let 关键字也是，有许多浏览器不兼容

 

EasyUi中Datetime控件，不能选择指定日期前后时间

$('#planRunDt').datebox('calendar').calendar({//只能选择前后时间
                validator: function (date) {
                    var now = new Date();
                    var d1 = new Date(now.getFullYear(), now.getMonth(), now.getDate() - 7);
                    var d2 = new Date(now.getFullYear(), now.getMonth(), now.getDate() + 7);
                    return date >= d1 && date <= d2;
                }
            });　

　　官方文档的提示：The validator function that is used to determine if a calendar day can be selected, return false to prevent from selecting a day. Available since version 1.3.6.。需要查看版本是否满足