如何通过js和jQuery实例演示获取input输入框值的方法？

本文共计441个文字，预计阅读时间需要2分钟。

如何使用JavaScript获取input输入框中的值，可以通过以下几种方式：

1. 通过name属性获取input输入框的值：javascript// 假设input的name属性为usernamevar usernameValue=document.getElementsByName('username')[0].value;

2. 通过id属性获取input输入框的值：javascript// 假设input的id属性为uservar usernameValue=document.getElementById('user').value;

3. 通过class属性获取input输入框的值：javascript// 假设input的class属性为uusrvar usernameValue=document.getElementsByClassName('uusr')[0].value;

以下是相应的HTML和jQuery代码示例：

HTML:

jQuery:javascript// 使用jQuery获取input输入框的值var usernameValue=$('input[name=username]').val();

如何用javascript获取input输入框中的值，js/jq通过name、id、class获取input输入框中的value

先准备一段 HTML

<input type="text" name"username" id="user" placeholder="用户名" class="uusr"><br>

一、jquery获取input文本框中的值

通过 name：

$('input[name="username"]').val()

通过 id：

$('#user').val()

通过 class：

$('.uusr').val()

二、javascript获取input输入框中的值

通过 name

document.getElementsByName("username")[0].value

通过 id

document.getElementById("user").value

通过 class

document.getElementsByClassName("uusr")[0].value

ps：下面看下jQuery获取各种input输入框的值

1.获取一组radio单选框的值（name属性为一组的radio的name属性）

$("input[name=element_name]:checked").val

2.获取select下拉框的值

$('#element').val()

内容扩展：

JS中的 oninput 事件在 IE9 以下版本不支持，需要使用 IE 特有的 onpropertychange 事件替代，这个事件在用户界面改变或者使用脚本直接修改内容两种情况下都会触发，有以下几种情况：

修改了 input:checkbox 或者 input:radio 元素的选择中状态， checked 属性发生变化。

修改了 input:text 或者 textarea 元素的值，value 属性发生变化。

修改了 select 元素的选中项，selectedIndex 属性发生变化。

if(isIE) { document.getElementById("input").onpropertychange = keys(); } else //需要用addEventListener来注册事件 { document.getElementById("input").addEventListener("input", keys, false); }

以上就是js与jquery获取input输入框中的值实例讲解的详细内容，更多关于js与jquery获取input输入框中的值的资料请关注易盾网络其它相关文章！