jquery获取多个相同name的input的value值

TLucas

已于 2023-03-26 13:23:38 修改

阅读量4.1k

点赞数 3

CC 4.0 BY-SA版权

分类专栏： jQuery 笔记文章标签：经验分享 jquery 前端

于 2021-11-25 13:12:46 首次发布

本文链接：https://blog.youkuaiyun.com/weixin_44146294/article/details/121535354

笔记同时被 2 个专栏收录

23 篇文章

订阅专栏

jQuery

6 篇文章

订阅专栏

本文通过一个实例展示了如何使用jQuery获取HTML页面中多个具有相同name属性的文本框值。在前端开发中，有时需要获取一组文本框的值，例如多个问题输入。通过jQuery的each()方法遍历这些元素并收集它们的值，可以轻松实现这一需求。点击按钮后，文本框的值将被存储到数组中并打印在控制台，方便进一步处理。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Jquery获取多个相同name的文本框值

一、以下是H5代码以及jQuery代码
二、输出结果效果

在前端实际开发过程中，常常会遇到多个文本框存在相同的“name”属性，这个时候就需要循环获取文本框所对应的值。本文就简单的介绍了Jquery如何实现获取多个name属性的文本值，希望对使用该方法的朋友有所帮助。

一、以下是H5代码以及jQuery代码

<body style="width: 100vw;margin: 0 auto;padding: 0vw;">
    <form>
        问题1：<input type="text" name="question" /><br>
        问题2：<input type="text" name="question" /><br>
        问题3：<input type="text" name="question" /><br>
        问题4：<input type="text" name="question" /><br>
        问题5：<input type="text" name="question" /><br>
        问题6：<input type="text" name="question" /><br>
        <input type="button" class="btn" value="提交" />
    </form>
</body>
<script>
    $('.btn').click(function () {
        let arr = [];
        $("input[name='question']").each(function () {
            arr.push($(this).val());
        });
        console.log(arr);
    });
</script>