jQuery：通过name获取div下的input的六种方法

最新推荐文章于 2025-05-29 08:16:37 发布

原创最新推荐文章于 2025-05-29 08:16:37 发布 · 6w 阅读

12 ·

CC 4.0 BY-SA版权

文章标签：

#js #html

js 同时被 3 个专栏收录

55 篇文章

订阅专栏

js_html

10 篇文章

订阅专栏

html

8 篇文章

订阅专栏

本文介绍了使用jQuery获取HTML中input元素值的六种方法，并展示了如何将这些元素序列化为字符串。通过不同的选择器获取元素，展示了每种方法获取到的值。此外，还演示了如何将input元素序列化。

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

1.获取input值的6种方法：

<!doctype html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>测试页面</title>
  <script type="text/javascript" src="jquery.js"></script>
 </head>
 <body>
 <div id="gjdiv" class="gjc">
	<input type="hidden" id="title" name="gj" value="113"/>
<input type="hidden" id="brief" name="gj" value="df"/>
<input type="hidden" id="content" name="gj" value="sg"/>
 </div>

<script>
$(document).ready(function(){
var param0 = $("input[name='gj']").val();
console.log("param0:"+param0);

var param1 = $(".gjc input[name='gj']").val();
console.log("param1:"+param1);

var param2 = $("#gjdiv input[name='gj']").val();
console.log("param2:"+param2);

var param3 = $("div input[name='gj']").val();
console.log("param3:"+param3);

var param4 = $("#gjdiv>input[name='gj']").val();
console.log("param4:"+param4);

var param5 = $("#gjdiv :input[name='gj']").val();
console.log("param5:"+param5);

console.log("stringify():"+JSON.stringify(param0));
//console.log(JSON.parse(param));

})

</script>
 </body>
</html>

结果：

获取的都是第一个input的值。

2.将input值序列化：

<!doctype html>
<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <title>测试页面</title>
  <script type="text/javascript" src="jquery.js"></script>
 </head>
 <body>
 <div id="gjdiv" class="gjc">
	<input type="hidden" id="title" name="gj" value="113"/>
<input type="hidden" id="brief" name="gj" value="df"/>
<input type="hidden" id="content" name="gj" value="sg"/>
 </div>

<script>
$(document).ready(function(){
var param0 = $("input[name='gj']").serialize();
console.log("param0:"+param0);

var param1 = $(".gjc input[name='gj']").serialize();
console.log("param1:"+param1);

var param2 = $("#gjdiv input[name='gj']").serialize();
console.log("param2:"+param2);

var param3 = $("div input[name='gj']").serialize();
console.log("param3:"+param3);

var param4 = $("#gjdiv>input[name='gj']").serialize();
console.log("param4:"+param4);

var param5 = $("#gjdiv :input[name='gj']").serialize();
console.log("param5:"+param5);

console.log("stringify():"+JSON.stringify(param0));
//console.log(JSON.parse(param));

})

</script>
 </body>
</html>

结果：