jquery如何获取input的值：多场景实操方法

jquery如何获取input的值，核心可通过val()方法实现，这是jQuery官方3.7.1版本主推的标准取值方式，能适配单行文本、密码、隐藏域等绝大多数普通input标签，原生语法简洁且兼容性较强，同时针对单选框、复选框、下拉框等特殊input类型需要搭配筛选逻辑使用，普通val()无法直接获取批量选中值，该方法仅适配引入jQuery库的网页场景，原生JS环境无法使用。

jquery获取普通input值

你可以通过元素选择器精准匹配input标签后，调用val()方法获取输入内容，常用选择器包含ID选择器、类选择器、标签选择器，其中ID选择器匹配精度最高，不会出现取值错乱问题。当input标签设置id属性为textInput时，书写代码$('textInput').val()即可获取输入框内的实时内容，获取到的值统一为字符串格式，空输入框会返回空字符串，不会出现undefined报错。

该取值方式无需额外参数，执行速度较快，在页面常规表单输入场景中适配度较高。如果需要实时监听输入变化并即时取值，可搭配input事件使用，绑定事件后用户每输入、删除字符，都会自动获取最新的input值，适配搜索实时联想、输入实时校验等交互需求。

jquery获取特殊input值

单选框、复选框属于特殊input类型，原生val()只能获取标签默认value值，无法获取用户选中状态对应的值，需要结合筛选语法实现精准取值。

• 单选框：通过:checked筛选选中项，代码为$('input[name=radioName]:checked').val()
• 复选框：需遍历所有选中项，批量收集多个选中值
• 隐藏input：直接使用val()即可正常取值，不受页面显示状态影响

复选框取值需要循环遍历选中元素，单独调用val()只能获取第一个选中项的值，无法收集全部选中内容。你可以通过each()方法遍历所有选中的复选框，将取值存入数组，最终得到完整的选中数据，这是jQuery适配复选框取值的通用逻辑，能有效避免数据遗漏问题。

不同input取值方法对比

取值的常见错误案例

使用html()或text()方法获取input值，会出现取值为空的问题。input属于自闭合表单元素，内部无文本内容存储，html()用于获取标签内部代码、text()用于获取文本内容，两种方法均无法读取表单输入值，这是新手最常出现的取值错误。

方法适用边界

jQuery所有input取值方法，仅支持已成功加载jQuery库的页面，未引入库、库加载延迟或加载失败时，所有$符号相关取值代码都会失效，出现脚本报错。jQuery3.x版本已不再支持IE8及以下老旧浏览器，在老旧浏览器环境中，该取值方法会出现执行异常。

取值后得到的内容均为字符串类型，即便用户输入数字，返回结果依旧是字符串，需要数值运算时，你必须手动通过Number()、parseInt()等方法完成类型转换，否则会出现字符串拼接而非数值计算的逻辑错误。