通过jQuery获取一组checkbox的选中项并显示在HTML页面中

这里是jQuery代码

$(function () {
  $("input[name=names]").click(function () { //获得所有的name=names的input,并给他们添加click监听事件
    var arr = new Array();
    $("input[name=names]:checked").each(function (key, value) {
      arr[key] = $(value).val();
    });
    $("#getnames").text("选中" + arr.length + "项:" + arr.join(","));//更新到p层上
  });
});

这里是HTML代码

<input type="checkbox" name="names" value="jim" />jim
<input type="checkbox" name="names" value="tom" />tom
<input type="checkbox" name="names" value="lily" />lily
<p id="getnames"></p>

运行效果

时间: 2024-08-03 07:23:45

通过jQuery获取一组checkbox的选中项并显示在HTML页面中的相关文章

jquery 获取一组元素的选中项 - 函数、jquery获取复选框值、jquery获取单选按钮值

做表单提交时,如果现在还在用form提交,用户体验很差,所以一般使用ajax提交. 其中需要获取每个表单输入元素的值,获取的时候像文本框这些还好说,Jquery提供了 .val() 方法,获取很方便,但是获取复选框和单选按钮的值确比较麻烦. 今天闲来无事封装了一个函数,以后获取复选框和单选按钮的值就只需要调用这个函数,传入jquery选择器就可以了,下面附上函数. 函数 /** * 获取单个或一组输入元素的选中项 * 传入Jquery选择器 * 支持:text,返回:文本 * 支持:hidden

jquery获取一组文本框的值

$("#btn5").click(function()  {    var str="";$("[name='checkbox'][checked]").each(function() '用来获取数组{        str+=$(this).val()+",";    '用来遍历数组    //alert($(this).val());    }) jquery获取一组文本框的值,布布扣,bubuko.com

js,jquery获取下拉框选中的option

js获取select选中的值: var sel=document.getElementById("select1"); var index = sel.selectedIndex; // 选中索引 albumid= sel.options[index].value;//要的值 jQuery获取下拉框选中的option: $("#s option:selected").val();

JQuery 多个checkbox 只选中一个

<form id="common-form"> <input name="check1" type="checkbox"/>check1 <input name="check2" type="checkbox"/>check2 <input name="check3" type="checkbox"/>check3 &l

jquery获取select标签的选中元素

select 标签配合 option 使用,是很好的下拉菜单,获取选中的选项值,可以用 jquery 的 api 简单直接的获取: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> </head> <body> <select id='selection' onclick="clickClick()"> <option&g

jquery获取select标签被选中的值

方案:通过option标签的select属性来获取文本与值 jQuery中获得选中select值 第一种方式$('#adverId option:selected').text();//选中的文本 $('#adverId option:selected') .val();//选中的值 $("#adverId").get(0).selectedIndex;//索引 第二种方式 $("#adverId").find("option:selected"

JQuery获取input checkbox

// 全选 $('#allcheck').click(function(){ $('input[name="check"]').prop('checked','true'); }); //反选 $('#reversecheck').click(function(){ $('input[name="check"]').each(function () { $(this).prop("checked", !$(this).prop("che

jQuery 获取单选按钮radio 已选中的值

<div id="wrap">                <input type="radio" name="aa" value="1" id="xz1" />                <input type="radio" name="aa" value="2" id="xz2" /&g

jquery获取一组相同标签内没有class的标签

$("ul>li[class!='pre'][class!='nex']").each(function(i){ $(this).html(i); });