<!DOCTYPE html  >

<html>

<head>

    <title>  获取爱好 </title>

    <meta http-equiv = "content-type" content ="text/html;charset=utf-8" />

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

</head>

<body>

<form id="myForm">

    <h3>选择你的爱好：</h3>

    <ul id="hobby">

        <li><input type="checkbox" value="音乐" />音乐</li>

        <li><input type="checkbox" value="登山" />登山</li>

        <li><input type="checkbox" value="游泳" />游泳</li>

        <li><input type="checkbox" value="阅读" />阅读</li>

        <li><input type="checkbox" value="打球" />打球</li>

        <li><input type="checkbox" value="跑步" />跑步</li>

        <li><input type="checkbox" value="其他" />其他</li>

    </ul>

    <hr/>

    <ul>

        <li><input type="button" value="查看我选择的爱好" /></li>

    </ul>

    <p id="text"></p>

</form>

<script type="text/javascript">

    $(function(){

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

            var value = "";

            /*$(":checkbox:checked").each(function() {

             value += $(this).val() + "<br/>";

             });*/

            var $hobbies = $(":checkbox:checked");

            for (var i = 0; i < $hobbies.length; i++) {

                value += $hobbies[i].value + "<br/>";

            }

            $("#text").html(value);

        });

    });

</script>

</body>

</html>

获取爱好.html

jQuery - 获取爱好的更多相关文章

  1. jquery】常用的jquery获取表单对象的属性与值

    [jquery]常用的jquery获取表单对象的属性与值 1.JQuery的概念 JQuery是一个JavaScript的类库,这个类库集合了很多功能方法,利用类库你可以用一些简单的代码实现一些复杂的 ...

  2. jquery获取dropdownlist的value和text值

    1.jquery //获取value值 $("#ddlSubmodel").val(); //获取text值 $("#ddlSubmodel").find(&q ...

  3. 用jQuery获取表单的值

    在日常开发过程中,有许多用到表单的地方.比如登录,注册,比如支付,填写订单,比如后台管理等等. 使用jQuery来获取表单的值是比较常见的做法. 常见表单 单行文字域:<input type=' ...

  4. Jquery获取select选中的文本与值

    jquery获取select选择的文本与值获取select :获取select 选中的 text :    $("#ddlregtype").find("option:s ...

  5. Js/Jquery获取iframe中的元素

    转载: Js/Jquery获取iframe中的元素 - - ITeye技术网站http://java-my-life.iteye.com/blog/1275205 在web开发中,经常会用到ifram ...

  6. jquery获取不到append出来的新元素的解决办法

    jquery获取不到append出来的新元素的解决办法 $('body').on("click","property",function(){}) jq1.7+ ...

  7. jQuery获取隐藏文本域

    [html] view plaincopyprint?//jquery获取隐藏域  <style type="text/css">  div{      width:1 ...

  8. js,jquery获取浏览器信息

    1.js获取: 查看:window.navigator 2.jQuery获取: chrome firefox 推荐使用navigator获取userAgent然后去正则匹配 参考匹配规则:http:/ ...

  9. 【转】jQuery获取Select option 选择的Text和Value

    获取一组radio被选中项的值:var item = $('input[name=items][checked]').val();获取select被选中项的文本:var item = $(" ...

随机推荐

  1. QQ空间里写的开发心得

    不回头看一眼还真没发现我已经写过这么多开发心得日志. 理一理设备数据走向  https://user.qzone.qq.com/1156740846/blog/1522292793 action的生命 ...

  2. Cesium学习笔记（九）：导入3D模型（obj转gltf）

    在用cesium的过程中难免需要导入别人做好的3D模型,这时候就需要将这些模型转成gltf格式了 当然,官方也给了我们一个网页版的转换器,但是毕竟是网页版的,效率极其低下,文件还不能太大,所以我们就需 ...

  3. windons共享的一些问题

    有时候访问共享一直说无法打开共享,但是别人确实是开了共享. 其中可能如下: 1.首先确定网络没有问题,win+R输入cmd,ping对方IP地址,保证是网络是通的,如果不通,关闭共享电脑的防火墙. 2 ...

  4. 基于fpga uart学习笔记

    2018年7月24日 uart 接收 部分测试成功,多谢开源骚客 邓堪文老师 ,想学的同学可以微信公众号搜索开源骚客 好啦!言归正传. 1.先附上老师的时序图,自己有点懒不想画,rx_t.rx_tt. ...

  5. 【JAVA】AES加密

    import java.security.SecureRandom; import javax.crypto.Cipher; import javax.crypto.KeyGenerator; imp ...

  6. 快速搭建vue2.0+boostrap项目

    一.Vue CLI初始化Vue项目 全局安装vue cli npm install --global vue-cli 创建一个基于 webpack 模板的新项目 vue init webpack my ...

  7. Python 元组和列表

    Python 元组 Python的元组与列表类似,不同之处在于元组的元素不能修改. 元组使用小括号,列表使用方括号. 元组创建很简单,只需要在括号中添加元素,并使用逗号隔开即可. 如下实例: tup1 ...

  8. Git 基础教程 之 远程推送

    当你从远程仓库克隆时,实际上Git自动把本地的master分支和远程的master分支对应了起来,并且,远程仓库默认名称是origin. git remote 查看远程库信息 git remote - ...

  9. App架构设计经验谈:接口”安全机制”的设计

    [原文地址 点击打开链接] 原创文章,转载请注明:转载自Keegan小钢 并标明原文链接:http://keeganlee.me/post/architecture/20160107 微信订阅号:ke ...

  10. nyoj_19_擅长排列的小明_201403011600

    擅长排列的小明时间限制:1000 ms  |  内存限制:65535 KB 难度:4描述 小明十分聪明,而且十分擅长排列计算.比如给小明一个数字5,他能立刻给出1-5按字典序的全排列,如果你想为难他, ...