插件 jQuery.Knob 中文API文档

🌙
手机阅读
本文目录结构

插件 jQuery.Knob 中文API文档

不错,向下兼容,可触摸,jQuery拨号

jQuery旋钮

  • 画布; 没有png或jpg精灵。
  • 触摸,鼠标和鼠标滚轮,实现键盘事件。
  • 向下兼容; 重载输入元素。

<input type="text" value="75" class="dial">

<script>
    $(function() {
        $(".dial").knob();
    });
</script>

选项

选项作为属性’data-option’提供:

…或者在“knob()”调用中:

$(".dial").knob({ ‘min’:-50, ‘max’:50 });

支持以下选项:

行为

  • min:最小值| 默认= 0。
  • max:最大值| 默认= 100。
  • 步骤:步长| 默认= 1。
  • angleOffset:以度为单位的起始角度 默认= 0。
  • angleArc:弧度以度为单位| 默认= 360。
  • 塞子:在keydown / mousewheel上以最小值和最大值停止| 默认为真。
  • readOnly:禁用输入和事件| 默认值=假。
  • 旋转:进展方向| 默认为顺时针。

UI

  • cursor:显示模式“cursor”,游标大小可以通过数值传递给选项,传递布尔值时使用默认宽度“true”| 默认=计。
  • 厚度:厚度。
  • lineCap:测量行程结束。| default = butt,round =圆形行结尾
  • 宽度:拨号宽度。
  • 高度:表盘高度。
  • displayInput:default = true | false =隐藏输入。
  • displayPrevious:default = false | true =显示具有透明度的上一个值。
  • fgColor:前景色。
  • inputColor:输入值(数字)颜色。
  • 字体:字体系列。
  • fontWeight:字体粗细。
  • bgColor:背景颜色。

Hooks

<script>
    $(".dial").knob({
        'release' : function (v) { /*make something*/ }
    });
</script>
  • ‘release’:在发布时执行
    • 参数:value:int,当前值
  • ‘change’:在每次更改值时执行
    • 参数:value:int,当前值
  • ‘draw’:绘制画布时
    • 背景:
      • this.g:canvas context 2D(参见Canvas文档)
      • 这个。$:jQuery包装元素
      • this.o:选项
      • this.i:输入
      • … console.log(this);
  • ‘cancel’:在[ esc] keydown上触发
  • ‘format’:允许格式化输出(添加单位%,ms …)

每个钩子函数的范围(this)是当前的Knob实例(参见演示代码)。

<input type="text" value="75" class="dial">

<script>
    $(".dial").knob({
        'change' : function (v) { console.log(v); }
    });
</script>

动态配置

<script>
    $('.dial').trigger(
        'configure',
        {
            "min":10,
            "max":40,
            "fgColor":"#FF0000",
            "skin":"tron",
            "cursor":true
        }
    );
</script>

设置值

<script>
    $('.dial')
        .val(27)
        .trigger('change');
</script>

支持的浏览器

测试Chrome,Safari,Firefox,IE> = 8.0(带有excanvas的IE8.0)。

AXIHE / 精选资源

浏览全部教程

面试题

学习网站

前端培训
自己甄别

前端书籍

关于朱安邦

我叫 朱安邦,阿西河的站长,在杭州。

以前是一名平面设计师,后来开始接接触前端开发,主要研究前端技术中的JS方向。

业余时间我喜欢分享和交流自己的技术,欢迎大家关注我的 Bilibili

关注我: Github / 知乎

于2021年离开前端领域,目前重心放在研究区块链上面了

我叫朱安邦,阿西河的站长

目前在杭州从事区块链周边的开发工作,机械专业,以前从事平面设计工作。

2014年底脱产在老家自学6个月的前端技术,自学期间几乎从未出过家门,最终找到了满意的前端工作。更多>

于2021年离开前端领域,目前从事区块链方面工作了