radio\checkbox\select用js\jq获取选中的值

最新推荐文章于 2023-01-02 08:56:13 发布

三水汪

最新推荐文章于 2023-01-02 08:56:13 发布

阅读量420

点赞数 1

分类专栏： javaScript解释性脚本语言 jQuery

本文链接：https://blog.csdn.net/u013005050/article/details/78117817

版权

javaScript解释性脚本语言同时被 2 个专栏收录

11 篇文章 0 订阅

订阅专栏

jQuery

7 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>获取勾选值</title>
</head>
<body>
<div id="wrap">
  <input type="radio" name="payMethod" value="1"/>男
  <input type="radio" name="payMethod" value="2"/>女
</div>

<div class="ch-wrap">
  <input type="checkbox" name="test" value="0"/>0
  <input type="checkbox" name="test" value="1"/>1
  <input type="checkbox" name="test" value="2"/>2
  <input type="checkbox" name="test" value="3"/>3
  <input type="checkbox" name="test" value="4"/>4
  <input type="checkbox" name="test" value="5"/>5
  <input type="checkbox" name="test" value="6"/>6
  <input type="checkbox" name="test" value="7"/>7
  <input type="button" οnclick="jqChk()" value="提 交checkbox"/>
</div>

<select id="selectDrop" name="">
  <option selected value="1">text1</option>
  <option value="2">text2</option>
</select>
<input type="button" οnclick="selectV()" value="提 交select"/>

<script type="text/javascript" src="../jquery_min/jquery-3.0.0.min.js"></script>
<script>
  //radio获取选中的值
  var val_payPlatform = $('#wrap input[name="payMethod"]:checked ').val();
  $("#wrap input").change(function () {
//    $('input[name="testradio"]:checked').val();
//    $('input:radio:checked').val();
//    $('input[@name="testradio"][checked]');
//    $('input[name="testradio"]').filter(':checked');
    var val_payPlatform = $('#wrap input[name="payMethod"]:checked ').val();
    console.log(3333, val_payPlatform);
  });

  //checkbox获取选中的值
  function chk() {
    var obj = document.getElementsByName('test'); //选择所有name="'test'"的对象，返回数组
    //取到对象数组后，我们来循环检测它是不是被选中
    var s = '';
    for (var i = 0; i < obj.length; i++) {
      if (obj[i].checked) s += obj[i].value + ','; //如果选中，将value添加到变量s中
    }
    //那么现在来检测s的值就知道选中的复选框的值了
    console.log(s == '' ? '你还没有选择任何内容！' : s);
  }
  function jqChk() { //jquery获取复选框值
    var chk_value = [];
    $('input[name="test"]:checked').each(function () {
      chk_value.push($(this).val());
    });
    console.log(chk_value.length == 0 ? '你还没有选择任何内容！' : chk_value);
  }

//select获取值
  function selectV() {

//js获取
//    var selectDrop = document.getElementById("selectDrop");
//    var index = selectDrop.selectedIndex;
//    var sv = selectDrop.options[index].value;
//    var st = selectDrop.options[index].text;
//    console.log(999,sv+" "+st);
//jq获取
    var selected = $("#selectDrop option:selected");
    var sv = selected.val();
    var st = selected.text();
        console.log(999,sv+" "+st);

  }

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

三水汪

关注

1
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
radio\checkbox\select用js\jq获取选中的值

html>html lang="en">head> meta charset="UTF-8"> title>获取勾选值title>head>body>div id="wrap"> input type="radio" name="payMethod" value="1"/>男 input type="radio" name="payMethod" value="2"/>女
复制链接

扫一扫