😊 Jquery 获取select选中项自定义属性的值

在前端开发中，`` 元素是常见的交互组件之一，而通过 jQuery 获取其选中项的值更是家常便饭。但有时候，我们不仅需要获取普通文本值，还需要访问 `` 的自定义属性值。这该如何实现呢？让我们一起来探索吧！

首先，确保你的 HTML 结构中有自定义属性设置。例如：

```html

红色

蓝色

```

这里每个 `` 都有一个 `data-custom` 属性作为自定义标识。

接下来，用 jQuery 来获取当前选中项的自定义属性值。代码如下：

```javascript

$('mySelect').on('change', function() {

let selectedValue = $(this).val(); // 获取选中的value值

let customAttr = $('option:selected', this).data('custom'); // 获取自定义属性值

console.log(`选中值: ${selectedValue}, 自定义属性值: ${customAttr}`);

});

```

这样，当用户选择不同的选项时，页面会输出对应的选中值和自定义属性值。这种方法简单高效，非常适合处理带有额外数据需求的场景！

💡 提示：记得引入 jQuery 库哦，否则代码无法运行。希望这个小技巧能帮到你！✨