Plugins - gnimnet/GnimJS GitHub Wiki

Cookie

Cookie插件提供了获取和设置Cookie的支持，使用函数 $.cookie 来操作cookie。 $.cookie 可以接受三个参数 name 、 value 、 options，options 包括 expires (保存天数)、 path (网站路径)、 domain (网站域)、 secure (安全选项)

$.cookie('demo','This is a demo');//设置Cookie
$.cookie('demo',null);//删除Cookie
var cookie=$.cookie('demo');//获取Cookie

快捷键

快捷键插件提供了网页和页面元素的快捷键绑定支持，使用函数 $.shortcut(shortcut,callback) (绑定全文)和 $(shortcut,callback).shortcut (绑定元素)。 shortcut参数必须为 Ctrl,Alt,Shift 作为前缀引导，可使用一个或多个(也可以不使用)，最后为一个一般按键。 shortcut参数可以包含 A-Z,0-9,F1-F12,Left,Up,Right,Down,Insert,Delete,Home,End,Pageup,Pagedown,Pause,Backspace,Tab,Enter,Esc,Space,(以及一些ASCII符号)

$.shortcut('Ctrl + Alt + Enter', function(e) {
    alert('Event On: document');
});//绑定到网页(Document)
$('#shortcut .input').shortcut('Ctrl + Alt + Enter', function(e) {
    $.noBubble(e);//禁止事件冒泡，否则网页快捷键监听会被触发
    alert('Input Value: ' + this.value);
});//绑定到文本框

###元素动画 FX插件用于提供元素动画的支持。插件包括静态函数 $.fx.currentStyle 、 $.fx.anim 、 $.fx.left 、 $.fx.right 、 $.fx.top 、 $.fx.bottom 。以及核心函数 $(selector).currentStyle 、 $(selector).anim 、 $(selector).left 、 $(selector).right 、 $(selector).top 、 $(selector).bottom 。

$.fx.currentStyle(node,style);//获取元素当前渲染样式名称
$.fx.anim(node, styles, duration, callback, type);//DOM元素动画
$.fx.left(node);//DOM元素左距离
$.fx.right(node);//DOM元素右距离
$.fx.top(node);//DOM元素顶距离
$.fx.bottom(node);//DOM元素底距离

$(selector).currentStyle(style);//第一个元素当前渲染样式名称

//DOM元素动画
//  styles  --  结束样式对象
//  duration  --  (可选)duration可为一个ms时间或者'fast'(200ms)、'slow'(1000ms)，默认为500ms
//  callback  --  (可选)callback回调函数的this为对应动画元素
//  type  --  (可选)type可以为'liner'(线性),'sine'(三角函数),'inertia'(重力回旋)，默认为二次
$(selector).anim(styles, duration, callback, type);
$(selector).left();//第一个DOM元素左距离
$(selector).right();//第一个DOM元素右距离
$(selector).top();//第一个DOM元素顶距离
$(selector).bottom();//第一个DOM元素底距离

演示代码：

$('#anim')
    .css({color:'#e83a37','font-size':'12px',width:'200px',
        'border-left-width':'1px','border-left-color':'#e83a37'})
    .anim({color:'#efeb4d','font-size':'20px',width:'400px',
        'border-left-width':'10px','border-left-color':'#efeb4d'},'fast');

获取URL参数

URL参数插件用于获取URL中的GET参数，使用函数 $.param(name) 。对于没有值的参数返回null，没有指定的参数返回undefined。

alert($.param('test'));

文本选择

文本选择插件用于设置和获取文本框中选择的文字，使用函数 $.sel(node,start,end) 和 $(selector).sel(start,end) 。不传 start 和 end 参数时将返回选择文本信息 {start,end,text} 。

var node=$('#sel .input')[0];
$(node).sel(0,node.value.length);//全选文本框

$('#sel .input').select(function(e){
    var node=e.currentTarget||e.srcElement;
    var sel=$(node).sel();
    var selText=node.value.substring(sel.start,sel.end);
    $.log('Select Input:'+selText,'#sel');
});