jQuery,根据name获取多个input表单的值

jQuery,根据name获取多个input表单的值,第1张

1、根据name取值:

<input name="inp" type="text" value="aaa">

<input name="inp" type="text" value="bbb">

<input name="inp" type="text" value="ccc">

$("input[name='inp']")val()

2、根据name取值遍历:

<input name="inp" type="text" value="aaa">

<input name="inp" type="text" value="bbb">

<input name="inp" type="text" value="ccc">

$("input[name='inp']")each(function(){alert($(this)val());})

扩展资料:

取出form中的input:

<script type="text/javascript" language="JavaScript" charset="UTF-8">

$(document)ready(function(){

var a=$("form input");

$each(

a,

function(name,object){

alert(name+":"+$(object)val());

}

);

});

</script>

js获取html元素的方式

+通过ID获取:getElementById('id属性值')

+通过标签名:getElementsByTagName('标签名')

+通过类名:getElementsByClassName('类名')

+通过name属性:getElementsByName('name属性值')

+通过选择器获取一个元素:querySelector

+通过选择器获取一组元素:querySelectorAll

1获取id值为d1的html元素

将获取到的html元素称为DOM节点对象,必须传参数,参数是string类型,是获取元素的id。返回值只获取到一个元素,没有找到返回null。

2通过标签名:getElementsByTagName('标签名')

参数是是获取元素的标签名属性,不区分大小写,根据标签名获取html元素, 返回的是一个数组(伪数组) 

通过类名:getElementsByClassName('类名')

参数是元素的类名,返回值是一个类数组,没有找到返回空数组。

通过类名:getElementsByClassName('类名')

必须传参数,参数是是获取元素的name属性,返回值是一个类数组,没有找到返回空数组。

通过选择器获取一个元素:querySelector

参数是选择器,返回值只获取到第一个元素。

通过选择器获取一组元素:querySelectorAll

参数是选择器,返回值是一个数组。

基于jquery$(function(){$(":button")click(function(){ var id= $(":button")attr("id"); var name= $(":button")attr("name");alert(id);alert(name);})})

根据多选框name来获得选中的值可用如下 jquery代码实现

$("input:checkbox[name='test']:checked")each(function() { // 遍历name=test的多选框

  $(this)val();  // 每一个被选中项的值

});

实例演示:给出两组多选框,点击按钮后分别获得两组中被选择的项目

示例代码如下

创建Html元素

<div class="box">

<span>请输入用户名,限定字母、数字或下划线的组合:</span><br>

<div class="content">

<span>水果:</span><br>

<input type="checkbox" name="fruit" value="梨子"/>梨子

<input type="checkbox" name="fruit" value="李子"/>李子

<input type="checkbox" name="fruit" value="栗子"/>栗子

<input type="checkbox" name="fruit" value="荔枝"/>荔枝<br>

<span>蔬菜:</span><br>

<input type="checkbox" name="vegetable" value="青菜"/>青菜

<input type="checkbox" name="vegetable" value="萝卜"/>萝卜

<input type="checkbox" name="vegetable" value="土豆"/>土豆

<input type="checkbox" name="vegetable" value="茄子"/>茄子

</div>

<input type="button" value="提交">

</div>

设置css样式

divbox{width:300px;padding:20px;margin:20px;border:4px dashed #ccc;}

divbox span{color:#999;font-style:italic;}

divcontent{width:250px;margin:10px 0;padding:20px;border:2px solid #ff6666;}

input[type='checkbox']{margin:5px;}

input[type='button']{height:30px;margin:10px;padding:5px 10px;}

编写jquery代码

$(function(){

// 设置属性值

$("input:button")click(function() {

var fruit = "";

var vegetable = "";

$("input:checkbox[name='fruit']:checked")each(function() {

fruit += $(this)val() + " ";

});

$("input:checkbox[name='vegetable']:checked")each(function() {

vegetable += $(this)val() + " ";

});

alert("已选择水果:"+fruit+",已选择蔬菜:"+vegetable);

});

})

观察效果

第一种方法就是自己写个方法获取所有的标签元素,在根据属性name的值去筛选

第二种方法就是documentquerySelectorAll()方法

例如你要查询所有name="ok"的标签

documentquerySelectorAll('[name="ok"]')

这样就可以了

望采纳

通过 val() 方法从 textarea 元素中取得的值是不含有回车(\r)字符的。但是如果该值是通过 XHR 传递给服务器的,回车(\r)字符会被保留(或者是被浏览器添加的,但是在原始数据中并不包含回车(\r))。可以使用下面的 valHook 方法解决这个问题:

别说排版和符号了,JAVA这软件就这样乱!

以上就是关于jQuery,根据name获取多个input表单的值全部的内容,包括:jQuery,根据name获取多个input表单的值、js获取html元素的方式、JavaScript :怎么获得页面元素的id和name值等相关内容解答,如果想了解更多相关内容,可以关注我们,你们的支持是我们更新的动力!

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/9799354.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-02
下一篇 2023-05-02

发表评论

登录后才能评论

评论列表(0条)

保存