fSelect学习使用记录

于 2021-01-11 09:44:19 发布
阅读量1.5k 收藏 2
点赞数
文章标签： javascript jquery html
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yz_jason/article/details/112461616
版权

fSelect学习使用记录

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	<title></title>
	<script src="./select-multiple.js"></script>
</head>
<body>
	<select name="fs_box" id="fs_box">
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
		<option value="4">4</option>
		<option value="5">5</option>
	</select>

	<script>
		/*调用插件*/
		$('#fs_box').fSelect();

		/*取值*/
		$('#fs_box').val();  // 是一个数组

		/*设置默认值*/
		var arr = [1, 2, 3, 4];
		arr = arr.split(',');
		// 第一步，先给select标签赋值
		$('#fs_box').val(arr);
		// 第二步，给fs-option 添加selected样式
		$('.fs-option').each( function() {
			var v = $(this)['context']['dataset']['value'];
			if( arr.indexOf(v) != -1 ) {
				$(this).addClass('selected');
			}
		})
		// 第三步，重新加载，使添加了selected样式的option处于选中
		$('#fs_box').fSelect('reloadDropdownLabel');
	</script>
</body>
</html>

默认的点击空白处会关闭或者esc关闭，如果想要只点击确定按钮才关闭

可以把select-multiple.js中对于这方面的addclass注释

取消esc关闭

关闭空白处关闭

如果你还有更好的方法或者使用心得，可以分享给我，一起共勉

yz_jason
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
fSelect.zip
11-12
select 下拉框多选，用select代替checkbox,HTML静态数据
fselect：使用类似SQL的查询查找文件
01-30
`fselect`是一个强大的命令行工具，它允许用户使用类似于SQL的语法在文件系统中查找文件，极大地提升了文件搜索的便捷性和效率。这款工具是由Rust编程语言编写的，以其稳定性和高性能著称，同时也为开发者提供了良好...
jquery Select 实现搜索以及checkbox多选
I am your sun ❤
05-04 2675
演示:点击打开链接&lt;!doctype html&gt; &lt;html&gt; &lt;head&gt; &lt;meta charset="utf-8"&gt; &lt;meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&gt; &lt;meta name=
f.select
weixin_30827565的博客
12-18 177
<%= f.select :id_eq, options_for_select(current_user.activities.show.where(:activity_type_id => 10).order('created_at desc').map{|a|[a.name,a.id]}, @activity.id), {}, :class => "input-select"...
fSelect下拉框多选，手动设置选中项
qq_37825370的博客
06-01 2258
var arr = ['1001','1002'] //第一步，先给select标签赋值 $("select").val(arr); //第二布，给fs-optgroup下对应的option添加样式selected $(".fs-optgroup").find(".fs-option").each(function () { if(arr.indexOf($(this)['context']['dataset']['value']) != -1){ $(this).addClass.
jquery fSelect
10-30
**jQuery fSelect** 是一个基于 jQuery 的插件，专门用于创建功能丰富的下拉复选框。这个插件在传统的HTML下拉菜单的基础上增加了很多实用功能，比如搜索功能，使得用户在大量的选项中能够快速找到所需的项，提高了...
fselect.rar
04-13
在使用`fselect`之前，开发者需要确保他们的环境支持JavaScript，并且可能需要引入相关的JavaScript库文件（如`fselect.js`）以及对应的CSS样式文件（如`fselect.css`）。在HTML中，他们需要创建一个`<select>`元素...
【批量下载】fselect等.zip
11-23
在IT行业中，前端开发是构建Web应用程序不可或缺的一部分，它涉及到用户与网站互动的界面设计和实现。...在压缩包文件"我的资源"中，可能包含了关于fselect的示例代码、配置文档或相关教程，供学习和参考。
Select.js是一款基于Tether的select下拉选择框美化插件-javascript
06-21
Select.js是一款基于Tether的select下拉选择框美化插件。 该下拉框美化插件内置3种皮肤主题。它在原生select元素的基础上通过Javascript和CSS来进行改造，并通过Tether插件来进行下拉框的定位。 Tether Tether 是一个小型的、专注的 JavaScript 库，用于定义和管理用户界面 (UI) 元素在网页上相互之间的位置。 它是一种用于 Web 开发人员构建功能的工具，这些功能需要根据另一个 UI 元素的位置精确定位某些 UI 元素。 在 UI 开发中经常会出现需要将元素附加到其他元素的情况，但是根据上下文将它们在 DOM 树中彼此相邻放置可能会出现问题。 例如，如果我们附加其他元素的元素固定在屏幕中央会发生什么？ 或者如果元素在可滚动容器内呢？ 我们如何防止附加元素在用户滚动时从视图中消失时被剪裁？ Tether 可以解决所有这些问题，甚至更多。 使用 Tether 构建的一些常见 UI 元素是工具提示、选择菜单、下拉菜单和导览。 Tether 很灵活，可以用来解决各种有趣的问题； 它根据各种用户交互（单击、滚动等）和布局
下拉框多选select多选
03-09
下拉框多选,3个积分意思一下 ,博文地址https://blog.csdn.net/qq_42909145/article/details/104756982
Js操作Select大全(取值、设置选中等等)
05-14
Js操作Select大全(取值、设置选中等等) Js操作Select大全(取值、设置选中等等)
用javascript来实现select标签的美化
龙的天空
08-16 1779
论坛经常有人会问到用CSS如何美化Select标签，其实但凡你看到很酷的都是用javascript来实现的。昨天试着做了一下，基本实现的初级功能。拿出来和大家一起分享一下。先可以看一下预览效果：http://www.iwcn.net/demo/select。【功能需求】1、调用要方便，做好之后应该像这样： 程序代码function loadSelect(selectobj){//传入一
select 下拉框多选，用select代替checkbox
那些年的代码
09-15 2003
分类：JS技巧jQuery 演示：http://www.freejs.net/demo/524/index.html <select class="demo" multiple="multiple"> <optgroup label="Languages"> <option value="cp">C++...
Linux shell 脚本编程-高级篇 （二）
devalone 的专栏
08-04 1682
继 Linux shell 脚本编程-高级篇 （一） 2. 图形化桌面环境中的脚本编程   2.1 创建文本菜单 创建交互式 shell 脚本最常用的方法是使用菜单。提供各种选项可以帮助脚本用户了解脚本能做什么和不能做什么。   通常菜单脚本会清空显示区域，然后显示可用的选项列表。用户可以按下与每个选项关联的字母或数字来选择选项。 shell 脚本菜单的核心是 case 命令。ca...
发布一个支持N级下拉列表联动的控件
Senton
10-29 189
最近，由于工作的需要，写了一个联动下拉列表控件，理论上支持N级联动，后台可以使用java的Spring3 MVC的@ResponseBody标注来返回数据(我现在的项目就是使用这种方法)或者，也可以使用其他方式，只要返回的数据格式为json就行，且不局限于java语言代码中。 写的不好的地方，请大家多指教，哪位朋友有好的建议也可以修改并贴出来与大家共享。 有兴趣的朋友可以更进一步的增强...
FSelector-解放双手,提高编码效率,减少大量的selecor文件
chengzichen_的博客
08-24 1466
FSelector 欢迎使用 Flyabbit �� 全家桶 FSelector 是一个精简强大的,无入侵selector生成器,解放双手,省去了大量的selecor 功能 效果 安装 用途 API TODO 作者 更变日志 Flyabbit系列 功能 快速，高效，低耗 简易的整合,轻量级 基本没有依赖于任何的三方库 安装 模块 FSelector ...
编译原理之--FIRST集、FOLLOW集 和 SELECT集
热门推荐
小菜鸟的博客
09-27 5万+
FIRST集、FOLLOW集 和 SELECT集 一、FIRST集 FIRST(A)为A的开始符或者首符号集。 1、定义： 设G=(VT，VN，S，P)是上下文无关文法 ，FIRST(α)={a|α能推导出aβ,a∈VT，α,β∈V*} 　　 特别的，若α能推导出ε,则规定ε∈FIRST(α)． 2、根据定义求解FIRST集（对每一文法符号X∈V 计算F
Js操作Select大全
何足道也
11-21 2636
jquery操作select(取值，设置选中） 每一次操作select的时候，总是要出来翻一下资料，不如自己总结一下，以后就翻这里了。 比如 1、设置value为pxx的项选中 $(".selector").val("pxx"); 2、设置text为pxx的项选中 $(".selector").find("option[text='pxx']").attr("selecte
写一个C语言的AD9832驱动，函数命名使用驼峰命名‘’
最新发布
03-23
非常感谢您的提问！以下是一个简单的C语言AD9832驱动的示例代码，函数命名使用了驼峰命名法： ```c #include <stdio.h> #include <stdlib.h> #include <stdint.h> #include <stdbool.h> // AD9832寄存器地址 #define AD9832_REG_FREQ0 0x4000 #define AD9832_REG_FREQ1 0x8000 #define AD9832_REG_PHASE0 0xC000 #define AD9832_REG_PHASE1 0xE000 #define AD9832_REG_CONTROL 0x2000 // AD9832控制寄存器位定义 #define AD9832_CTRL_B28 13 #define AD9832_CTRL_HLB 12 #define AD9832_CTRL_FSELECT 11 #define AD9832_CTRL_PSELECT 10 #define AD9832_CTRL_RESET 8 #define AD9832_CTRL_SLEEP1 7 #define AD9832_CTRL_SLEEP12 6 #define AD9832_CTRL_OPBITEN 5 #define AD9832_CTRL_DIV2 3 #define AD9832_CTRL_MODE 1 // AD9832控制寄存器值定义 #define AD9832_CTRL_RESET_VAL (1 << AD9832_CTRL_RESET) #define AD9832_CTRL_B28_VAL (1 << AD9832_CTRL_B28) #define AD9832_CTRL_HLB_VAL (1 << AD9832_CTRL_HLB) #define AD9832_CTRL_FSELECT_VAL (1 << AD9832_CTRL_FSELECT) #define AD9832_CTRL_PSELECT_VAL (1 << AD9832_CTRL_PSELECT) #define AD9832_CTRL_OPBITEN_VAL (1 << AD9832_CTRL_OPBITEN) #define AD9832_CTRL_DIV2_VAL (1 << AD9832_CTRL_DIV2) #define AD9832_CTRL_MODE_VAL (1 << AD9832_CTRL_MODE) // AD9832时钟频率 #define AD9832_CLK_FREQ 25000000 // AD9832频率寄存器值计算宏定义 #define AD9832_FREQ_REG_VAL(freq) ((uint32_t)((freq) * (1 << 28) / AD9832_CLK_FREQ)) #define AD9832_PHASE_REG_VAL(phase) ((uint16_t)((phase) * (1 << 12) / 360.0)) // AD9832驱动结构体定义 typedef struct { uint32_t freq; // 频率 uint16_t phase; // 相位 bool enable; // 使能 } ad9832_t; // AD9832初始化函数 void ad9832_init(void) { // 初始化SPI接口 // ... // 复位AD9832 uint16_t ctrl_reg = AD9832_CTRL_RESET_VAL; // 写入控制寄存器 // ... } // AD9832设置频率函数 void ad9832_set_freq(ad9832_t *ad, uint32_t freq) { ad->freq = freq; uint32_t freq_reg_val = AD9832_FREQ_REG_VAL(freq); // 写入频率寄存器0 // ... // 写入频率寄存器1 // ... } // AD9832设置相位函数 void ad9832_set_phase(ad9832_t *ad, uint16_t phase) { ad->phase = phase; uint16_t phase_reg_val = AD9832_PHASE_REG_VAL(phase); // 写入相位寄存器0 // ... // 写入相位寄存器1 // ... } // AD9832使能函数 void ad9832_enable(ad9832_t *ad, bool enable) { ad->enable = enable; uint16_t ctrl_reg = 0; if (enable) { ctrl_reg |= AD9832_CTRL_B28_VAL; ctrl_reg |= AD9832_CTRL_FSELECT_VAL; ctrl_reg |= AD9832_CTRL_PSELECT_VAL; ctrl_reg |= AD9832_CTRL_OPBITEN_VAL; ctrl_reg |= AD9832_CTRL_MODE_VAL; } // 写入控制寄存器 // ... } ``` 希望这个示例代码能够帮助您完成AD9832的驱动开发！如果您有任何问题或需要进一步的帮助，请随时联系我。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值