JQuery输入框中输入内容改变事件
封面图
•
2025-11-18
•
jQuery
236
0
0
0
在 jQuery 中,如果你想监听输入框(`<input>` 或 `<textarea>`)中内容的变化,可以使用 `.on('input', ...)` 事件来实现。这个事件会在用户输入内容时立即触发,适用于实时监听输入内容的变化。 ### 示例代码: ```html <!DOCTYPE html> <html> <head> <title>Input Change Event</title> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> </head> <body> <input type="text" id="myInput" placeholder="请输入内容..."> <script> $('#myInput').on('input', function() { var inputValue = $(this).val(); console.log('输入的内容是:', inputValue); }); </script> </body> </html> ``` ### 说明: - `$('#myInput')`:选择器选中 ID 为 `myInput` 的输入框。 - `.on('input', ...)`:绑定 `input` 事件,当输入内容发生变化时触发。 - `$(this).val()`:获取当前输入框的值。 --- ### 其他相关事件对比: | 事件 | 触发时机 | 是否支持实时监听 | |------|----------|------------------| | `input` | 用户输入时立即触发 | ✅ 是 | | `change` | 输入框失去焦点后才触发 | ❌ 否 | | `keyup` | 每次按键释放时触发 | ✅ 是,但不如 `input` 精准 | > **推荐使用 `input` 事件**,因为它能更准确地捕捉到输入内容的每一次变化(包括粘贴、拖拽等操作)。 如果你有其他需求,比如只在特定条件下触发,或者处理表单提交前的验证,也可以告诉我,我可以进一步帮你扩展功能。
上一篇:
jquery unwrap函数介绍
下一篇:
jQuery操作checkbox选择
标题录入,一次不能超过6条
留言
评论