您现在的位置是:首页 > Javascript
当前栏目
jQuery获取数组对象的值
2023-03-14 10:23:59 时间
在我们用jQuery开发的时候会遇到这样的情况,name有多个或者相似的name有多个。这时候我们需要获取其中某一个的值或者要分别获取他们的值,这时候我们可以用jQuery先获取一个对象数组,然后再获取其中的一个值。先把代码奉上:
<html> <head> <meta charset="utf-8"/> <title>jQuery获取多个数组的值</title> <script src="../js/jquery-2.1.4.min.js" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> function testjQueryArray(){ alert($("input[name='jQueryArray']")[0].value); alert($($("input[name='jQueryArray']")[1]).val()); $("input[name^='jQueryArray']").each(function(i){ if(i == 2) alert(this.value); }); $("input[name^='jQueryArray']").each(function(i){ if(i == 0) alert($(this).val()); }); } </script> </head> <body> <input type="text" name="jQueryArray" value="1111"/><br/> <input type="text" name="jQueryArray" value="1221"/><br/> <input type="text" name="jQueryArray" value="1331"/><br/> <input type="button" value="点击一下吧" onclick="testjQueryArray()"><br/> <input type="button" name="bindFun" value="运行时绑定" /> </body> <script> $( $("[name='bindFun']").on("click",function(){ alert($("input[name='jQueryArray']")[0].value); alert($($("input[name='jQueryArray']")[1]).val()); $("input[name^='jQueryArray']").each(function(i){ if(i == 2) alert(this.value); }); $("input[name^='jQueryArray']").each(function(i){ if(i == 0) alert($(this).val()); }); }) ); </script> </html>
说明:
方式一: var orderId = $("input[name='jQueryArray']")[0].value;
$("input[name='jQueryArray']")[0] 为一个Input对象,所以可以直接用原生JS的对象.value来获取
方式二:$($("input[name='jQueryArray']")[i]).val();
$("input[name='jQueryArray']")[i] 为一个Input对象,所以不能调用jQuery里的val()方法,如果要用jQuery里的val()方法,需要将$("input[name='jQueryArray']")[i]转换为jQuery对象,即$($("input[name='ajaxOrderId']")[i]);
方式三:$("input[name^='jQueryArray']").each(function(i){if(i == 2)alert(this.value);});
利用jQuery的each()函数来进行循环,获取其中的值。注意的是这里的this是原生DOM对象。
相关文章
- 鲜为人知但很有用的 HTML 属性
- 翻转再翻转!有意思的水平横向溢出滚动
- 自定义计数器小技巧!CSS 实现长按点赞累加动画
- 过五关!React高频面试题指南
- 软件开发中的十个认知偏差
- 不需要 JS!仅用 CSS 也能达到监听页面滚动的效果!
- 一文读懂TypeScript类型兼容性
- Vue 的响应式原则与双向数据绑定
- 快速掌握 TypeScript 新语法:Infer Extends
- JWT教你如何证明你是我的人!
- 一篇带给你 V8 GC 的实现
- 面试官:请使用JS完成一个LRU缓存?
- 通过可视化来学习JavaScript事件循环
- 新的跨域策略:使用 COOP、COEP 为浏览器创建更安全的环境
- 为什么有人说 vite 快,有人却说 vite 慢?
- 种草 Vue3 中几个好玩的插件和配置
- 超全面的前端工程化配置指南
- Vue 状态管理未来样子
- Volatile关键字能保证原子性么?
- 面试突击:SpringBoot 有几种读取配置文件的方法?