如何用jquery获取当前页面中input的个数?

Question

<input type="text" name="name" value="John"/>
<input type="text" name="password" value="jack"/>
<input type="text" name="url" value="tom"/>
-------------------------------------------------------------------------
代码如上，如何获取当前页面中input的个数?初学。数量为3，问题是如何获取到这个数量?

Answer 1

jQuery的length 属性可以获取包含 jQuery 对象中元素的数目，所以获取input的个数可用如下代码实现

$('input').length;       // 所有input的数量，包括文本框、单选按钮、复选框、隐藏域等
$('input:text').length;  // 文本框的数量

示例代码如下

创建Html元素

<div class="box">
<span>点击按钮获取文本框数量：</span><br>
<div class="content">
<input type="text" name="name" value="John"/>
<input type="text" name="password" value="jack"/>
<input type="text" name="url" value="tom"/>
</div>
<input type="button" value="点击获取文本框数量">
</div>

设置css样式

div.box{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}
div.box span{color:#999;font-style:italic;}
div.content{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}
input[type='button']{height:30px;margin:10px;padding:5px 10px;}
input[type='text']{width:200px;height:35px;padding:5px 10px;margin:5px 0;border:1px solid #ff9966;}

编写jquery代码

$(function(){
$(":button").click(function() {
alert($("input:text").length);
})
})

观察效果

Answer 2

$("input").length

本回答被提问者采纳

Answer 3

$("input[type='text']").size()