📜  EasyUI jQuery 开关按钮小部件

📅  最后修改于: 2022-05-13 01:55:57.623000             🧑  作者: Mango

EasyUI jQuery 开关按钮小部件

EasyUI 是一个 HTML5 框架,用于使用基于 jQuery、React、Angular 和 Vue 技术的用户界面组件。它有助于为交互式 Web 和移动应用程序构建功能,为开发人员节省大量时间。

在本文中,我们将学习如何使用 jQuery EasyUI 设计开关按钮。开关按钮有两个部分:“开”“关”。用户可以单击或点击来切换开关

EasyUI for jQuery 下载:

https://www.jeasyui.com/download/index.php

句法:

特性:



  • width:开关按钮的宽度
  • height:开关按钮的高度
  • handleWidth:开关按钮中心手柄的宽度
  • 选中:定义按钮是否被选中
  • disabled:定义是否禁用按钮
  • readonly:定义按钮是否只读
  • reversed:设置为 true onText 值和 offText 值将切换它们的位置
  • onText:左侧的文本值。
  • offText:右侧的文本值
  • handleText:中心句柄的文本值。
  • value:绑定到按钮的默认值。

事件:

  • onchange:在已选中的值更改时触发

方法:

  • 选项:返回选项对象
  • 调整大小:调整开关按钮的大小
  • disable:禁用开关按钮
  • enable:启用开关按钮
  • readonly:启用/禁用只读模式
  • 检查:检查开关按钮
  • 取消选中:取消选中开关按钮
  • clear:清除开关按钮的“选中”值
  • 重置:重置开关按钮的“选中”值
  • setValue:设置开关按钮值

CDN 链接:首先,添加项目所需的 jQuery Easy UI 脚本。

示例 1:

HTML


 

    
    
             
    
    
 
    
 
    
 
    
    
 
    
    
     
    
    
 
    

 

 
    

GeeksforGeeks

    

EasyUI jQuery switchbutton widget

      


输出:

参考: http://www.jeasyui.com/documentation/