select 中取 option 的自定义属性

最新推荐文章于 2022-03-31 16:49:41 发布
原创 最新推荐文章于 2022-03-31 16:49:41 发布 · 777 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#select #option

博客内容展示了一段代码，通过jQuery选择器，在类名为.select的元素中查找被选中的option元素，并获取其data-value属性。

$(".select").find("option:selected").attr("data-value")

select自定义属性值
游海东的技术专栏
04-20 1万+
select自定义属性值1、问题背景     下拉框可以传递值和内容，不过有时为了传值，还需要连带其他的值也一起传过来；如果用title属性，鼠标移到下拉框上方会显示出来，这样就会导致被暴露出来。所以，为了安全和传值方便，可以利用自定义属性。2、实现源码 <% String path = request.getContextPath(); String basePath = request.get
layui select获取自定义属性方法
10-18
在本篇文章中，我们主要探讨了如何在layui框架中获取select元素的自定义属性。layui是一个前端UI框架，它为Web开发者提供了一套丰富的界面元素和操作方式，尤其在处理表单元素时提供了很多便利。 首先，我们了解到...
select 获取选中option里的自定义属性值
感谢遇到的每一个人的博客
10-31 9771
问题：获取select 中 option自定义的属性，使用了一个 省市区三级联动的插件，然后获取里面的option值 解决：jQuery方法 &lt;select id="selectList" &gt; &lt;option value="浙江省" data-code="10003"&gt;浙江省&lt;/option&gt; &lt;option value=&quot
select option带自定义图片
09-19
select option 自定义图片的js 、css 以及代码展示，javaScript ；
关于select option自定义标签的说明
hanqunfeng的专栏
12-15 5926
我总是觉得在select的标签中拼option是不那么方便的事，所以我喜欢使用标签来做这件事，将所有的信息直接编写在jsp中，后台不需要增加代码，真的挺舒服的，在这里我不想说如何弄一个自定义标签，看看书相信不难搞明白的，我想说一下如何在自定义标签中获得select的真实值并默认显示这个值，ok，开始吧。 1.如果使用的是struts标签，方式如下:import org.apache.s
html中select的option自定义属性，然后js 获取
zhangle_123的博客
06-21 8174
1、 &lt;select id="mySelect"  onchange="selectTurnToUrl(this)"  class="form-control" style="height: 24px; line-height: 24px; padding: 0 12px;border-radius:0"&gt;&lt;/select&gt;//首先给select一个id2、自定义optio
vue.js 获取当前自定义属性值
10-19
在Vue.js中，我们通常使用Vue的指令或方法来获取这些自定义属性的值。本文将详细介绍如何在Vue.js中获取自定义属性值。 首先，需要明确的是，在HTML中，所有以“data-”为前缀的属性都会被自动存储在一个名为`...
option自定义属性的用处
08-23
### option自定义属性的作用及其应用 #### 一、引言 HTML 作为构建网页的基础语言之一，提供了多种标签用于创建动态且丰富的用户界面。其中 `<option>` 标签主要用于 `<select>` 下拉列表中，为用户提供一系列选项...
javascript select option对象总结
习惯在马桶上思考
12-20 963
一基础理解: var e = document.getElementById("selectId"); e. options= new Option("文本","值") ; //创建一个option对象,即在标签中创建一个或多个文本 //options是个数组,里面可以存放多个文本这样的标签 1:options[ ]数组的属性: length属性--------...
js中select 中options的属性
03-03 295
Select   选择区（下拉菜单、列表）对象   由“&lt;select&gt;”指定。         属性         name   返回/设定用&lt;input   name="..."&gt;指定的元素名称。     length   返回   Select   对象下选项的数目。     selectedIndex   返回被选中的选项的下标。这个下标就是在   o...
获取select标签下option的自定属性值
zhangyinhu8689的专栏
10-20 833
[b]获取select标签下option的自定属性值[/b] str1 str2 文章转自 http://blog.youkuaiyun.com/zho...
yii2 select2下option自定义属性
Niche_的博客
03-31 1067
在使用select2有时候我们需要把一些参数预加载到option的属性上去，避免再网络请求 <?= $form->field($model, 'fruits') ->widget(\kartik\select2\Select2::className(), [ 'data' => [1 => '香蕉', 2 => '苹果', 3 => '橘子'], 'options' => [ 'placeholder' => '请输
使用jQuery操作select元素的option标签添加自定义属性
Sun的专栏
11-12 2553
创建 $('#BrandList').change(function() { $.ajax({ url: "@Url.Action("get", "open")", type: "post", dataType: "json", data: { "BrandID": $("#BrandList")...
获取select下的第一个option的自定义属性值
weixin_41033048的博客
09-05 1161
$('select').children(1).data('sid');
vue 获取select选中的option 自定义属性_小白也能秒懂Vue源码中那些精细设计（选项处理）...
weixin_29720641的博客
02-03 2991
我"崩"不住了，在彭凡同志锲而不舍的催促下这篇文章终于"蛋"生了。 说正经的这篇文章不好写，不好写的原因是我不太擅长写这些类比文,但它还是写出来了。 相信大部分人都有开发过功能插件，在写插件的时候普遍应用基本思想是以"默认配置为优先，以用户配置为覆盖"。如果你觉得简单先别着急穿裤子走人继续往下看看。Validator插件$("form").Validator(); 之前写过一个轻量级数据校验插件使...
element select 自定义option(可自定义选择，可自定义输入)
weixin_40466351的博客
02-18 6035
一、效果 二、所遇问题与思路解决 1、怎样让有些字段能点击，有些字段点击不收缩，并且能够自定义呢？ 解决办法：把自定义字段disabled 设置为true ，使其点击不收缩； 自定义 2、点击选择框里面的选择框，不收缩外面的选择框？ 解决办法：设置select 属性 popperAppendToBody 为false 3、样式问题，修改页面样式 4、重新赋值 三、主要代码 <div class="mr10" style="width: 150px"> <el-select
Vue form-item select option 自定义校验
热门推荐
XiaoJL博客
07-16 1万+
Vue 下拉框校验，判断如果选择的是默认第一个下拉框，则提示用户选择下拉框中的选项。在校验的时候有如下问题记录。 一、正确自定义校验下拉框源码如下 <template> <el-card class="form-container" shadow="never"> <el-form :model="secondTitle" :rules="rules...
jq select option change事件获取option的自定义属性
最新发布
09-20
在 jQuery 的 select 元素的 option change 事件中获取 option 自定义属性，可通过绑定 change 事件来实现。 以下是不同示例下的具体代码： 示例一： ```javascript // 通过绑定 change 事件，当下拉框内容发生变化时事件被启动 $("#wlms").bind("change",function(){ // 获取自定义属性的值 var bianhao = $(this).find("option:selected").attr("bianhao"); }); ``` 在 HTML 中部分是： ```html <select id="wlms"> <option bianhao="abc"></option> </select> ``` 示例二： ```javascript // 通过绑定 change 事件，当下拉框内容发生变化时事件被启动 $("#qipa250").bind("change",function(){ // 获取已经选中的 option 自定义属性的值 var url= $(this).find("option:selected").attr("data-url"); }); ``` 对应的 select 内容： ```html <select class="form-control" name="qipa250" id="qipa250" onchange="check_qipa250()"> <option value="奇葩天地" data-url="WWW.QIPA250.COM"> 大写 </option> <option value="奇葩天地网" data-url="www.qipa250.com"> 小写 </option> </select> ``` 示例三： ```javascript $('select').change(function() { console.log($(this).find("option:selected").data('down')); }) ``` 对应的 HTML 内容： ```html <select class="form-control"> <option value="" data-down="0">Home</option> <option value="" data-down="1">News</option> </select> ``` 上述代码均展示了在 jQuery 的 select 元素的 option change 事件中获取 option 自定义属性的方法，主要是通过 `$(this).find("option:selected")` 选中当前被选中的 option，再使用 `attr()` 或 `data()` 方法获取自定义属性的值，使用 `attr()` 可获取任意自定义属性，而 `data()` 通常用于获取以 `data-` 开头的自定义属性 [^1][^2][^4]。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值