Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >使用jQuery从表单中获取所选值

使用jQuery从表单中获取所选值
EN

Stack Overflow用户
提问于 2020-01-01 13:13:13
回答 3查看 67关注 0票数 0

我有一个表单,它有一个定义如下的选择字段

myName[]是这样的,因为在注册表单中有几次重复(用户首先定义他想要输入多少表单,然后生成那么多表单)

现在,我想在选择某个元素时使用jQuery获取选定的值,但正如预期的那样,它不会起作用:它试图从一个id中获取信息,而这个id不止一个。结果是它总是用找到的id获取第一个选择字段的内容。我尝试将id更改为class,但不起作用。

那么,如何获得实际触发事件的选择框的选定值呢?

代码语言:javascript
运行
AI代码解释
复制
$(document).ready(function() {
  $('#idOfmyName').change(function() {
    var naam = $(this).find("option:selected").attr('value');
    alert(naam);
  });
});
代码语言:javascript
运行
AI代码解释
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="myname[]" id="idOfmyName">
  <option value="jack">Jack</option>
  <option value="rose">Rose</option>
</select>

EN

回答 3

Stack Overflow用户

发布于 2020-01-01 13:16:10

如果你想要选择的元素,为什么不能直接使用$(this).val()呢?

但是,是的,当您有多个相同ID时,jQuery将优先选择它找到的第一个ID-尽管您似乎确实知道这一点;在此演示中,我已经将其更改为一个类

代码语言:javascript
运行
AI代码解释
复制
$(document).ready(function() {
  $('.idOfmyName').on('change', function() {
    alert($(this).val());
  });
});
代码语言:javascript
运行
AI代码解释
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<select name="myname[]" class="idOfmyName">
  <option value="jack">Jack</option>
  <option value="rose">Rose</option>
</select>

<select name="myname[]" class="idOfmyName">
    <option value="harry">Harry</option>
    <option value="sally">Sally</option>
</select>

<select name="myname[]" class="idOfmyName">
    <option value="edward">Edward </option>
    <option value="vivian">Vivian </option>
</select>

票数 0
EN

Stack Overflow用户

发布于 2020-01-01 13:31:27

对于多个,你可以这样做

代码语言:javascript
运行
AI代码解释
复制
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 <select name="myname[]" class="idOfmyName">
    <option value="jack">Jack</option>
    <option value="rose">Rose</option>
  </select>
 <select name="myname[]" class="idOfmyName">
 <option value="jack">Jack</option>
  <option value="rose">Rose</option>
 </select>
 <script>
  $(document).ready(function() {
     var names = [];
     $('.idOfmyName').change(function() {
    var naam = $(this).find("option:selected").attr('value');
    if($.inArray(naam,names)){
       names.push(naam);
    }
    alert(names);
  });
});
</script>
票数 0
EN

Stack Overflow用户

发布于 2020-01-01 13:50:16

使用onchange方法获取选定值的Vanilla JavaScript方法

代码语言:javascript
运行
AI代码解释
复制
function getSelectedValue(val) {
    alert(val);
}
代码语言:javascript
运行
AI代码解释
复制
<select name="myname[]" onchange="getSelectedValue(this.value)">
    <option value="jack">Jack</option>
    <option value="rose">Rose</option>
</select>

<select name="myname[]" onchange="getSelectedValue(this.value)">
    <option value="harry">Harry</option>
    <option value="sally">Sally</option>
</select>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/59552849

复制
相关文章
将tensor转换为图像_tensor转int
版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 举报,一经查实,本站将立刻删除。
全栈程序员站长
2022/11/07
13K0
如何将ownCloud转换为Nextcloud
ownCloud的核心开发团队中一部分人员启动了一个名为Nextcloud的项目。虽然ownCloud将继续开发,但您可能想了解新项目的功能。Nextcloud和ownCloud共享一个公共代码库,这意味着将现有的ownCloud安装迁移到Nextcloud中。
小铁匠米兰的v
2018/08/02
2.8K0
如何将Array转换为List?
可以使用 Arrays.asList() 方法, 该方法接受一个数组作为输入,并返回一个列表作为输出。
程序你好
2018/07/23
1.6K0
java如何将String转换为enum
已知枚举对应的String值,希望得到对应的枚举值。例如,已知"A",希望得到对应的枚举——Blah.A,应该怎么做? Enum.valueOf()是否能实现以上目的,如果是,那我如何使用?
硬核编程
2020/07/23
4.1K0
如何将视频轻松转换为 GIF
有时看到一条有意思的视频想发到朋友圈,但朋友圈有限制时长,而且也不方便,这时可以把视频转GIF(再做成表情包也可以),再发到朋友圈或者微博(不用像视频一样需要等待审核)。
苏生不惑
2020/02/26
2K0
如何将pdf转换为word 2.0
再次以《新冠肺炎诊疗方案(试行第七版)》为例,该文件为图片性pdf,文字不可复制。
生信菜鸟团
2020/06/04
2.7K0
Java 如何将 List 转换为 MAP
上面的代码将会把 Id 作为 Key,然后生成的 Map 是以 id 为 Key,Animal 为Value 的 Map。
HoneyMoose
2022/10/12
2.2K0
Java 如何将 List 转换为 MAP
如何将pdf转换为word 3.0
相对于封装的软件,python和R的操作需要稍微折腾一下。浏览论坛的时候的发现了一款轻量级程序,尝试了一下还不错,看一下转换的效果:
生信菜鸟团
2020/08/04
1.9K0
如何将pdf转换为word 3.0
java如何将String转换为Int
Short.valueOf/parseShort, Long.valueOf/parseLong等也是有类似差别。
硬核编程
2020/07/23
1.8K0
如何将 JSON 转换为有序判断?
JSON(JavaScript Object Notation)是系统之间数据交换的流行格式。它是一种轻量级、基于文本且易于解析的格式,已成为互联网上数据交换的标准。但是,JSON 不会为数据结构中的元素提供任何顺序。虽然这在大多数情况下可能不是问题,但在某些情况下,元素的顺序很重要。
很酷的站长
2023/08/11
7220
如何将 JSON 转换为有序判断?
matplotlibt图像转OpenCV图像
有时候,我们需要使用Matplotlib库强大的绘图函数来在numpy.ndarray格式的图像上进行一些可视化,比如关键点绘制,投影点绘制。绘制完后,还需要把matplotlib的figure对象转换为numpy.ndarray 格式的对象,方便和原图进行比较。有时候为了可视化的美观,需要验证保证转换后的图像与原始图像大小一致。这里记录一下操作的流程,以及一些常遇到的问题。
王云峰
2023/10/23
8060
图像正转
算法:图像正转是通过原始图像中被展开的圆形区域参数构造顺时针展开后的矩形区域,然后根据坐标映射关系将像素值依次填充进去即可。一个标准的圆形区域展开为矩形区域,而展开后的矩形区域高度即是圆形区域的半径r,展开后的矩形区域长度自然是2Πr。
裴来凡
2022/05/29
3570
图像正转
[1154]如何将字符串转换为datetime
1.把datetime转成字符串: 2017-11-23 17:05:18 2.把字符串转成datetime: 2017-11-23 16:10:10 3.把字符串转成时间戳形式: 1511424610.0 4.把时间戳转成字符串形式: 2017-11-23 17:05:18 5.把datetime类型转外时间戳形式: 1511427918.0
周小董
2022/07/27
3.8K0
mysql整型转字符串_java中如何将字符串转换为字符数组
select * from A order by cast(name as unsigned);
全栈程序员站长
2022/09/27
25.5K0
java中如何将数组转换为List
如何将其转换为ArrayList <Element> arraylist = ???
硬核编程
2020/07/23
3.6K0
如何将文字转换为对应的PathGeometry
其实我们可以使用FormattedText的BuildGeometry将字符串转成对应的Geometry
黄腾霄
2020/06/10
1.8K0
如何将Pandas数据转换为Excel文件
将数据导出到Excel文件通常是任何用户阅读和解释一组数据的最优先和最方便的方式。通过使用Pandas库,可以用Python代码将你的网络搜刮或其他收集的数据导出到Excel文件中,而且步骤非常简单。
玖柒的小窝
2021/11/01
8.1K0
如何将 CentOS 8 转换为 CentOS Stream
CentOS 未来是不会更新数字版本了。CentOS 项目组,未来会变更为Stream版本,也就是俗称的滚动版本,那么如何将数字版本升级为滚动版本呢?
小陈运维
2021/10/13
1.9K0
【python】print函数从python2转换为python3形式
python3 相对于 python2 多了一个括号,如果手动一个个修改的话,工作量比较大 习惯python3的写法就不愿意用python2的语法规则。碰巧碰到了一个大型的python2项目。所以这时候py2to3就诞生了
20岁爱吃必胜客
2023/03/06
1.6K0
【python】print函数从python2转换为python3形式
GIF图像转换为多张JPG
HTML5学堂:在JS效果中,有一个使用代码处理多张连续的JPG图像,显示为动态GIF图的效果。于是乎,自己不得不制作多个连续的JPG图片。既然要做素材,也就顺便看看怎么用PS把GIF图像转换为多张J
HTML5学堂
2018/03/12
1.6K0
GIF图像转换为多张JPG

相似问题

如何将Base64转换为图像

20

如何将base64转换为图像php

14

Flutter:如何将base64转换为图像?

375

如何将base64转换为TIFF图像或PNG图像?

22

如何将日期从8转换为8

40
添加站长 进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

扫码加入开发者社群
关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

扫码关注腾讯云开发者公众号
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档