<!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. 通过yum命令搭建lamp环境(centos6.5)

    centos 6.5 1.yum安装和源代码编译在使用的时候没啥区别,但是安装的过程就大相径庭了,yum只需要3个命令就可以完成,源代码需要13个包,还得加压编译,步骤很麻烦,而且当做有时候会出错,源 ...

  2. JS高级——面向对象方式解决歌曲管理问题

    需要注意的问题: 1.其他模块若是使用构造函数MP3创建对象,唯一不同的就是他们传入的音乐库是不一样的,所以构造函数中存在一个songList属性,其他一样的就被添加到了构造函数的原型对象之中 2.原 ...

  3. JS——select标签

    <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&quo ...

  4. JS——AJAX

    向服务器发送请求如需将请求发送到服务器,我们使用 XMLHttpRequest 对象的 open() 和 send() 方法:Open方法了有两种请求方式——get和post 与 POST 相比,GE ...

  5. Oracle、Db2、SqlServer、MySQL 数据库插入当前系统时间

    做易买网项目,由于对数据库插入系统时间不了解,常常遇到的问题: 1.java.sql.SQLException: ORA-01861: 文字与格式字符串不匹配.原因:由于获取系统时间类型不对,应为sy ...

  6. 汇总——WEB前端资源网

    前端攻城师 爱思资源网 HTML5吧 0101后花园 前端网 编程教程和源代码示例 Javascript中文网 Web前端资源网 移动端HTML5资源整理 Web开发者 SegmentFault 前端 ...

  7. python dns请求

    一.DNS dns(domain name system)域名系统 ,主要用来把主机名转换成ip地址.其至今能存在的原因有两个: 能使人们记住名字,而不是ip地址: 允许服务器改变地址,但使用相同的名 ...

  8. spring IOC bean间关系

    1.0 继承关系 实体 package com.java.test5; import java.util.*; /** * @author nidegui * @create 2019-06-22 1 ...

  9. HDU 4027（线段树）

    HDU4027 题意:操作指令为0时,对区间[x,y]之间的数字进行开平方:指令为1的时候,对区间[x,y]之间的数字求和并输出: 思路:线段树处理就OK了,但是64位内的数最多开8次平方就为1了(开 ...

  10. windows下python-nmap运行过程中出现的问题及解决办法

    python-nmap 运行时出现了一下错误 D:\python\untitled5\Scripts\python.exe D:/python/untitled5/test.py Traceback ...