`
xitonga
  • 浏览: 588408 次
文章分类
社区版块
存档分类
最新评论

jquery选择器的简单应用

 
阅读更多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>choose</title>


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


/**
下拉列表选择的是高层就可以选两个checkbox,如果是中层和于员工则只能选择一个checkbox
当是中层和员工 已经选择一个的时候。 再选另一个checkbox弹出对话框提示中层和员工只能选择一个。
*/


$(function(){

var opt=1; // 全局变量
$("#sel").change(function(){
opt=$("#sel>option:selected").val();
$(".bm").attr("checked","");
});

$(".bm").click(function(){
//如果是中层和员工才做判断
if(opt==2||opt==3){
var count=0;
//循环所有选中的checkbox
$(".bm:checked").each(function(i,obj){
count++;
if(count>1){
alert("中层和员工只能选择一个");
$(obj).attr("checked","");
}
});
}

});




});


</script>
</head>


<body>
<select id="sel">
<option value="1" >高层</option>
<option value="2" >中层</option>
<option value="3">员工</option>
</select>
选择1<input type="checkbox" name="bm" class="bm" value="哈密瓜" />
选择2<input type="checkbox" name="bm" class="bm" value="火龙果" />
</body>
</html>
分享到:
评论

相关推荐

    jQuery选择器之基本选择器用法实例分析

    本文实例讲述了jQuery选择器之基本选择器用法。分享给大家供大家参考,具体如下: 初学jQuery,为了能系统地学习好jQuery,今天特意把自己的学习心得归纳一下,贴上来与初学者共享,今天我主要总结的是jquery的基本...

    JQuery权威指南 源代码

    前 言 第1章 jquery开发入门/1 1.1 jquery概述/2 1.1.1 认识jquery /2 1.1.2 jquery基本功能/2 1.1.3 搭建jquery开发环境/3 1.1.4 编写第一个简单的jquery应用/3 ...jquery 选择器/12 2.1 jquery选择器概述/13

    jQuery基础案例分析(初学者入门精通最佳案例)

    2.jQuery选择器 3.jQuery中的DOM操作 4.jQuery中的事件和动画 5.jQuery对表单、表格的操作及更多应用 6.jQuery与Ajax的应用 7.jQuery插件的使用和写法 8.用jQuery打造个性网站 9.jQuery Mobile 10.jQuery各个版本的...

    锋利的jQuery_高清_书签.part2

    2.1 jQuery选择器是什么 2.2 jQuery选择器的优势 2.3 jQuery选择器 2.3.1 基本选择器 2.3.2 层次选择器 2.3.3 过滤选择器 2.3.4 表单选择器 2.4 应用jQuery改写示例 2.5 选择器中的一些注意事项 2.5.1 选择器中含有...

    jQuery简单应用

    jQuery简单应用,包括选择器的简单使用,简单方法的使用,如LOAD,LINK等

    日期选择器:jquery datepicker的使用

    实现日期选择输入功能。jquery 控件的简单应用。

    jQuery权威指南-源代码

    2.1 jQuery选择器概述/13 2.1.1 什么是选择器/13 2.1.2 选择器的优势/13 2.2 jQuery选择器详解/17 2.2.1 基本选择器/18 2.2.2 层次选择器/20 2.2.3 简单过滤选择器/22 2.2.4 内容过滤选择器/25 2.2.5 可见...

    JQuery权威指南源代码

    使用jQuery选择器实现隔行变色 JavaScript代码检测页面元素 jQuery代码检测页面元素 使用jQuery基本选择器 使用jQuery层次选择器 使用jQuery基本过滤选择器 使用jQuery内容过滤选择器 使用jQuery可见性过滤...

    jQuery中复合选择器简单用法示例

    主要介绍了jQuery中复合选择器简单用法,结合实例形式分析了jQuery中复合选择器的概念、功能、应用场景及相关使用方法,需要的朋友可以参考下

    jQuery权威指南366页完整版pdf和源码打包

    jquery 选择器/12 2.1 jquery选择器概述/13 2.1.1 什么是选择器/13 2.1.2 选择器的优势/13 2.2 jquery选择器详解/17 2.2.1 基本选择器/18 2.2.2 层次选择器/20 2.2.3 简单过滤选择器 2.2.4 内容过滤...

    column-selector:jQuery 列选择器

    语法简单且与其他 jQuery 选择器相似,因此学习曲线非常小。 以下示例显示如何选择表格第四列中的所有单元格。 $('#mytable tbody td:nth-col(4)'); 选择器可以采用多种类型的参数来选择列,例如关键字、数字索引...

    jquery nth-child()选择器的简单应用

    通过网上咨询使用这个选择器便很容易的解决。特此记录一下。 下面是主要的代码 js脚本: 代码如下: [removed] $(document).ready( function () { //每隔五行给li加一个样式 $(‘.article_li li:nth-child(5n)’)....

    超实用的jQuery代码段

    超实用的jQuery代码段精选近350个jQuery代码段,涵盖页面开发中绝...11.29 在类选择器前用标签选择器加快速度 11.30 缓存jQuery对象以提升性能 11.31 使用find()函数提升子查询的性能 11.32 使用jQuery操作DOM的限制

    jquery公用web功能组件GRI.zip

    从GRI(Ghost Rider Igniter)应用php开发框架中提取出的公用web功能组件,包括列表,图,日期,月份选择器,上传等。微信公众平台用到 文件列表 jQuery.min.js 官方jQuery v1.7.2版本 gri.controls.css 组件的...

    jQuery移动端日期(datedropper)和时间(timedropper)选择器附源码下载

    我们经常会应用到日期和时间选择器,之前我们使用最多的是jQuery UI的datepicker(),那么今天我给大家介绍一款非常有趣的日期和时间选择器,它分为日期选择器datedropper以及时间选择器timedropper,他们俩尤其适合...

    jQuery和Ajax

    关于jQuery和Ajax的简单介绍,可以学到jQuery特殊选择器和方法等的类型以及应用。

    简单易用的颜色选择器icolor

    JSJQUERY简单易用的颜色选择器icolor,只需要把要接受颜色值的class="iColorPicker"就可以轻松应用,一定不要忘记先加载jquery类库哟,官网上有。

    jquery插件使用方法大全

    jQuery 1.1.3(2007年7月):这次小版本变化包含了对jQuery选择符引擎执行速度的显著提升。从这个版本开始,jQuery的性能达到了Prototype、Mootools以及Dojo等同类JavaScript库的水平。 jQuery 1.2(2007年9月):...

    jQuery详细教程

    关键点是学习 jQuery 选择器是如何准确地选取您希望应用效果的元素。 jQuery 元素选择器和属性选择器允许您通过标签名、属性名或内容对 HTML 元素进行选择。 选择器允许您对 HTML 元素组或单个元素进行操作。 在 ...

Global site tag (gtag.js) - Google Analytics