<!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. MyBatis分页组件--PageHelper

    一.介绍 PageHelper是国内非常优秀的一款开源的 mybatis 分页插件,它支持基本主流与常用的数据库,例如 Oracle.Mysql.MariaDB.SQLite.Hsqldb 等. 官网 ...

  2. 使用 RxJava 的正确姿势

    最近在使用 RxJava 时遇到了一些比较诡异的问题,排查的过程中做了点研究,发现平时大家的用法多多少少都有些问题.有些地方存在隐患,有些用法不够简练,我把这些问题简单做一下分类和总结,供大家参考. ...

  3. jQuery——插件制作

    1.$.fn.extend:扩展 jQuery 元素集来提供新的方法(通常用来制作插件),使用时是$('选择器').方法 2.$.extend:扩展jQuery对象本身,用来在jQuery命名空间上增 ...

  4. dubbo之优雅停机

    优雅停机 Dubbo 是通过 JDK 的 ShutdownHook 来完成优雅停机的,所以如果用户使用 kill -9 PID 等强制关闭指令,是不会执行优雅停机的,只有通过 kill PID 时,才 ...

  5. Windows Server 2008无法远程连接

    Server 2008 R2依次配置好之后,重启发现总是远程桌面时而连接不上.具体现象如下: 偶尔可以通过桌面远程连接连接到Server.以为是防火墙的问题,各种设置——甚至关闭,依然无法连接.反复重 ...

  6. MYSQL数据库迁移到ORACLE数据库

    一.环境和需求1.环境 MySQL数据库服务器: OS version:Linux 5.3 for 64 bit mysql Server version: 5.0.45 Oracle数据库服务器: ...

  7. 注解是建立在class文件基础上的东西，同C语言的宏有异曲同工的效果

    注解是建立在class文件基础上的东西,同C语言的宏有异曲同工的效果 https://www.cnblogs.com/deman/p/5519901.html @是java注解,即annotation ...

  8. requirejs（模块化）

    <script src="../../dist/js/require.js" data-main="../../dist/js/main.js">& ...

  9. centos7安装个人网盘owncloud

    现在个人资料越来越重要,网络速度也已经满足日常需要,网盘已经是生活着存取个人数据不可缺少的工具. 下面在linxu centos7下面安装owncloud搭建自己私人网盘: 1.新建一个账号用来安装个 ...

  10. VMware虚拟机下Ubuntu安装VMware Tools详解

    一.安装步骤 1.开启虚拟机,运行想要安装VMware Tools的系统,运行进入系统后,点击虚拟机上方菜单栏的“虚拟机(M)”->点击“安装 VMware Tools”,图片所示是因为我已经安 ...