11

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8">

    <title>测试表单获取元素值</title>

    <link rel="stylesheet" type="text/css" href="../bootstrap-3.3.7-dist/css/bootstrap.min.css">

    <script type="text/javascript" src="../js/jquery-3.2.1.min.js"></script>

    <style type="text/css">

        *{

            margin: ;

            padding: ;

        }

        .main{

            padding: 0px 15px;

        }

        input{

            margin-right: 15px;

            display: inline-block;

        }

    </style>

</head>

<body>

    <div class="main">

        <div class="row">

            <label>姓名:</label><input type="text" name="name" value="" />

        </div>

        <div class="row">

            <label>多选:</label>

            <label for="checkbox1">多选1:</label><input type="checkbox" name="多选" id="checkbox1" value="checkbox1">

            <label for="checkbox2">多选2:</label><input type="checkbox" name="多选" id="checkbox2" value="checkbox2">

            <label for="checkbox3">多选3:</label><input type="checkbox" name="多选" id="checkbox3" value="checkbox3">

        </div>

        <div class="row">

            <label>下拉:</label>

            <select name="opt">

                <option value="opt1" name="opt">下拉1</option>

                <option value="opt2" name="opt">下拉2</option>

                <option value="opt3" name="opt">下拉3</option>

                <option value="opt4" name="opt">下拉4</option>

            </select>

        </div>

        <div class="row">

            <label>单选:</label>

            <label for="radio1">单选1:</label><input type="radio" name="radio" id="radio1" value="radio1">

            <label for="radio2">单选2:</label><input type="radio" name="radio" id="radio2" value="radio2">

            <label for="radio3">单选3:</label><input type="radio" name="radio" id="radio3" value="radio3">

            <label for="radio4">单选4:</label><input type="radio" name="radio" id="radio4" value="radio4">

        </div>

        <button id="submit">提交</button>

    </div>

    <script type="text/javascript">

        $("#submit").on("click",function(){

            //给多选框的某个选中

            $(".main").find("input[name='多选']")[].checked=true;

            //获取多选框选中的索引：

            console.log("多选框suoyin："+$("input[name='多选']").index($("input[name='多选']:checked")));

            //获取复选框选中的值：

            var arr=document.getElementsByName("多选");

            for(var i=;i<arr.length;i++){

                if(arr[i].checked){

                    console.info("多选框:"+arr[i].value);

                }

            }

             //反选

            // $('input[name="多选"]').each(function () {

            //     $(this).prop("checked", !$(this).prop("checked"));

            // });

            //输入框设置值

            $("input[name='name']").val("wlz111")

            //获取输入框值：

            console.info("输入框:"+$("input[name='name']").val());

            //将下拉框设置成某个值

            $(".main").find("select[name='opt']").get().selectedIndex = ;

            //获取下拉框值

            console.log("下拉框："+$('select').val());

            //单选按钮设置值

            $(".main").find("input[name='radio']")[].checked=true;

            //获取单选按钮的值：

            console.log("单选按钮："+$(".main").find("input[name='radio']:checked").val());

            //获取单选按钮选中的索引：

            console.log("单选按钮suoyin："+$("input[type=radio]").index($("input[type=radio]:checked")));  

        })

    </script>

</body>

</html>

radio，checkbox，select，input text获取值，设置哪个默认选中的更多相关文章

  1. jSP的3种方式实现radio ,checkBox,select的默认选择值。

    jSP的3种方式实现radio ,checkBox,select的默认选择值.以radiao 为例:第一种方式:在jsp中使用java 脚本,这个方法最直接,不过脚本太多,不容易维护<%Stri ...

  2. 【TP3.2+onethink】radio+checkbox+select 空间 编辑页面选中，附录 js 返回上一页

    1.TP3.2框架 如何实现 [radio+checkbox+select 空间 编辑页面选中],说实话,比较繁琐,不咋地!! 不废话,上代码:(其中 XX_arr  变量一维数组) <div ...

  3. Jquery获取input=text 的值

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. Jquery操作radio,checkbox,select表单操作实现代码

    一 .Select jQuery获取Select选择的Text和Value: 1. $("#select_id").change(function(){//code...}); / ...

  5. Radio Checkbox Select 操作

    一个小总结 <!DOCTYPE html> <html> <head> <meta name="description" content= ...

  6. 今个忽然晓得，原来radio不是普通去获取值的！

    今日,写js校验.对于不太会的,总是陌生的.碰见radio的取值,习惯的用document.getElementsByName("")[0].value去获取值,却忘记了radio ...

  7. 【VC++技术杂谈002】打印技术之获取及设置系统默认打印机

    本文主要介绍如何获取以及设置系统的默认打印机. 1.获取系统中的所有打印机 获取系统中的所有打印机可以使用EnumPrinters()函数,该函数可以枚举全部的本地.网络打印机信息.其函数原型为: B ...

  8. 用jQuery的attr()设置option默认选中无效的解决 attr设置属性失效

    表单下拉选项使用selected设置,发现第一次默认选中成功,在页面不刷新的情况下,再次下拉,selected属性设置了,默认选中不生效 在手机端有些浏览器用jQuery的attr()方法设置sele ...

  9. RadioButtonFor值为false.默认选中的问题

    (自己看了下.图片有点宽.显示的不全.可以右键新标签查看) 作为一个新手.今天又开始了mvc的学习之旅.然而学习过程中又遇到了一个奇妙的问题.... 一切按部就班到了这里.注册界面. 一眼看上去就不对 ...

随机推荐

  1. C# 中的treeview绑定数据库(递归算法）

    近日面试的给我两道题目,一道是IQ测试,第二个就是题目所言 总共两个表 department(id int not null primary key,parentid int,name char(50 ...

  2. 显示图片中CDC和HDC问题

    (m_Pic.LoadPictureData(pBuffer, nSize));//接作调用函数读pBuffer的jpg数据准备显示 showimage();//显示图片 void Caccess_t ...

  3. 指针*pbuffer和getchar 读取字符串

    在C语言入门教材里看到这一段代码,没看懂是什么意思.char buffer[10];char *pbuffer = buffer;while( (*pbuffer++ = getchar() )!= ...

  4. JavaScript的parseint()函数

    定义和用法 parseInt() 函数可解析一个字符串,并返回一个整数. 语法 parseInt(string, radix) 参数 描述 string 必选项.要转换为数字的字符串. radix 可 ...

  5. JavaWeb的编码问题

    http://blog.csdn.net/yuhaiqiang_123/article/details/51811419

  6. Perfmon - Windows 自带系统监测工具

    本文转载自oscar999 一. 简述 可以用于监视CPU使用率.内存使用率.硬盘读写速度.网络速度等. Perfmon提供了图表化的系统性能实时监视器.性能日志和警报管理,系统的性能日志可定义为二进 ...

  7. json学习之JSONArray的应用（转载）

    从json数组中得到相应java数组,如果要获取java数组中的元素,只需要遍历该数组. 1 /** 2 * 从json数组中得到相应java数组 3 * JSONArray下的toArray()方法 ...

  8. java 从服务器下载文件并保存到本地

    昨天在做一个项目时,用到了从服务器上下载文件并保存到本地的知识,以前也没有接触过,昨天搞了一天,这个小功能实现了,下面就简单的说一下实现过程: 1.基础知识          当我们想要下载网站上的某 ...

  9. [iOS微博项目 - 4.5] - 每条微博的底部工具条

    github: https://github.com/hellovoidworld/HVWWeibo A.每条微博的底部工具条 1.需求 每条微博底部都有一个工具条 显示3个按钮:评论.转发.赞 按钮 ...

  10. flask中current_app._get_current_object()与current_app有什么区别？

    https://segmentfault.com/q/1010000005865632/a-1020000005865704