jquery 使用笔记
一下是在做项目中用到jquery涉及到的一些知识点,把源码复制过来,省得以后忘记了:
<link href="<%=request.getContextPath()%>/css/jquery.alerts.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="<%=request.getContextPath()%>/js/jquery.alerts.js"></script>
<script type="text/javascript">
$(function(){//页面加载完成执行的方法
ebc();
});
//给单选按钮绑定事件
function ebc(){
//每个活动下单选按钮绑定事件
$("input[name^='radio_']").each(function(){
$(this).bind("click", function(){
var rname = $(this).context.name;
$("input[name='"+rname+"']").each(function(){
var monid = $($(this).next()[0]).val();<%--获取下一个input的值,隐藏字段--%>
if(this.checked){
//设置复选按钮
$("input[name='check_"+monid+"']").each(function(){
$(this).attr("disabled",false);
});
//设置输入框
<%--$("input[name='input_"+monid+"']").each(function(){
$(this).attr("disabled",false);
});--%>
//设置div
$("div[name='div_"+monid+"']").each(function(){
$(this).attr("dis",1); //可用
});
}else{
$("input[name='check_"+monid+"']").each(function(){
$(this).attr("checked",false);
$(this).attr("disabled",true);
var id = $(this).attr("id");<%-- 获取当前点击的复选框的id --%>
$("#"+id.replace("check","input")).val("1");
});
$("input[name='input_"+monid+"']").each(function(){
$(this).attr("disabled",true);
});
$("div[name='div_"+monid+"']").each(function(){
$(this).attr("dis",0); //禁用
});
}
});
});
});
//每个加减按钮绑定事件
$("div[name^='div_']").each(function(){
$(this).bind("click", function(){
var id = $(this).attr("id");<%--当前被点击的div的id--%>
var type = $(this).attr("type");<%--当前被点击的div的type--%>
var rmid = getstr(id,"_",1,3);<%--获取id中第一个和第三个"_"之间的字符(ruleid_moneyid)--%>
var rmidi = getstr(id,"_",1,4);<%--获取id中第一个和第四个"_"之间的字符(ruleid_moneyid_i.index)--%>
if($(this).attr("dis")==1 && !$("#input_"+rmidi).attr("disabled")){<%--当前div可用,并且输入框可用--%>
if(type=="min"){//-
<%--首先判断复选框勾选的个数是否大于等于总款数,然后再判断--%>
var count1 = $("#input_count1_"+rmid).val();<%-- 获取当前规则金额下最多可选的件数 --%>
var currentCount1 = 0;
$("input[id^='input_"+rmid+"']:not(:disabled)").each(function(){<%-- 获取没有被禁用的复选框的个数 --%>
currentCount1++;
});
var input= $("#input_"+rmidi);
var val= $(input).val()*1;
if(val>1){
$(input).val(val-1);
if(currentCount1 < count1){<%--当前选中的复选框个数小雨款数--%>
$("input[id^='check_"+rmid+"']").each(function(){<%--把其他复选框启用--%>
if(!this.checked){
$(this).attr("disabled",false);
}
});
}
}else{
$(input).val(1);
}
}else if(type=="add"){//+
<%--需要判断是否超过了最大的件数(所有的复选框选中的赠品的个数相加)--%>
var count2 = $("#input_count2_"+rmid).val();<%-- 获取当前规则金额下最多可选的件数 --%>
//TOODO Andy 点击+的时候如果件数达到了最大就把其他的复选框不可用
var currentCount2 = 0;
$("input[id^='input_"+rmid+"']:not(:disabled)").each(function(){
currentCount2 += $(this).val()*1;
});
if(currentCount2 < count2){<%--数量没有达到最大值--%>
var input= $("#input_"+rmidi);
var val= $(input).val()*1;
var max = $(input).attr("max")*1;<%--这个赠品本身的限制--%>
if(val<max){
$(input).val(val+1);
currentCount2++;
}else{
$(input).val(max);
}
}
if(currentCount2 >= count2){<%--把其他的复选框不可用--%>
$("input[id^='check_"+rmid+"']").each(function(){
if(!this.checked){
$(this).attr("disabled",true);
}
});
}
}else{
}
}else{
}
});
});
//每个复选框绑定事件
$("input[name^='check_']").each(function(){
<%--绑定click事件--%>
$(this).bind("click", function(){
var name = $(this).attr("name");<%-- 获取当前点击的复选框的name --%>
var id = $(this).attr("id");<%-- 获取当前点击的复选框的id --%>
var ruleid = getstr(id,"_",1,3)<%-- 获取 "_规则id_金额id"为了后面获取条件做准备 --%>
var count1 = $("#input_count1_"+ruleid).val();<%-- 获取当前规则金额下最多可选的款数 --%>
var count2 = $("#input_count2_"+ruleid).val();<%-- 获取当前规则金额下最多可选的件数 --%>
var temcheckednum = 0;<%--记录被选中的复选框的个数--%>
$("input[name='"+name+"']").each(function(){
if(this.checked){
temcheckednum = temcheckednum+1;
}
});
<%--如果用户选择的复选框的个数大于或者等于要求的最大的款数,就要把其他的复选框不可用,反之:把所有的复选框都可用--%>
if(temcheckednum>=count1){
$("input[name='"+name+"']").each(function(){
var input = $("#input"+$(this).attr("id").substr(5));
if(!this.checked){
$(this).attr("disabled",true);
$(input).val("1");
$(input).attr("disabled",true);
}else{
$(input).attr("disabled",false);
}
});
}else{
$("input[name='"+name+"']").each(function(){
var input = $("#input"+$(this).attr("id").substr(5));
$(this).attr("disabled",false);
if($(this).attr("checked")){
$(input).attr("disabled",false);
}else{
$(input).val("1");
$(input).attr("disabled",true);
}
});
}
});
});
}
//进入结算中心
function gocheckcart(val){
if(val==0){
location.href="http://justeasy.com.cn/";
}else{
var str = "";
$("input[name^='check_']").each(function(){
//console.log(this.checked);
if(this.checked){
//check
var id = $(this).attr("id");
var largessname = $("#largess"+id.substr(5)).html();
var num = $("#input"+id.substr(5)).val();
str+= " "+largessname+" "+num+"份\r\n";
}
});
if($.trim(str)==""){
jConfirm("您还没有选择赠品,确定要进入结算中心吗?","温馨提示",function(r){
if(r){//确定
}else{
}
});
}else{
str = "您选择的赠品如下:\r\n"+str;
str += "确定要进入结算中心吗?";
jConfirm(str,"温馨提示",function(r){
if(r){//确定
}else{
}
});
}
}
}
<%--封装的一个工具类: str:原字符串,cha:查找的字符,start:查找的字符第几次出现的位置(开始),end:查找的字符第几次出现的位置(结束)--%>
function getstr(str,cha,start,end){
var f = 0;<%--第几次(开始)出现位置的下标--%>
var tem = 0;<%--临时变量--%>
for(var i=1;i<=end;i++){
if(i==start){
f = str.indexOf(cha);
tem = f;
}else{
tem = str.indexOf(cha,tem+1);
if(i==end)
break;
}
}
return str.substr(f+1,tem-f-1);
}
</script>
jquery 使用笔记的更多相关文章
- jQuery学习笔记(一)jQuery选择器
目录 jQuery选择器的优点 基本选择器 层次选择器 过滤选择器 表单选择器 第一次写博客,希望自己能够长期坚持,以写博客的方式作为总结与复习. 最近一段时间开始学习jQuery,通过写一个jQue ...
- jQuery 学习笔记
jQuery 学习笔记 一.jQuery概述 宗旨: Write Less, Do More. 基础知识: 1.符号$代替document.getElementById( ...
- jQuery学习笔记(一):入门
jQuery学习笔记(一):入门 一.JQuery是什么 JQuery是什么?始终是萦绕在我心中的一个问题: 借鉴网上同学们的总结,可以从以下几个方面观察. 不使用JQuery时获取DOM文本的操 ...
- jQuery学习笔记 - 基础知识扫盲入门篇
jQuery学习笔记 - 基础知识扫盲入门篇 2013-06-16 18:42 by 全新时代, 11 阅读, 0 评论, 收藏, 编辑 1.为什么要使用jQuery? 提供了强大的功能函数解决浏览器 ...
- jQuery整理笔记文件夹
jQuery整理笔记文件夹 jQuery整理笔记一----jQuery開始 jQuery整理笔记二----jQuery选择器整理 jQuery整理笔记三----jQuery过滤函数 jQuery整理笔 ...
- JQuery学习笔记——层级选择器
JQuery学习笔记--层级选择器 上一篇学习了基础的五种选择,分别是id选择器,class选择器,element选择器,*选择器 和 并列选择器.根据手册大纲,这篇学习的是层级选择器. 选择器: 1 ...
- jQuery学习笔记之Ajax用法详解
这篇文章主要介绍了jQuery学习笔记之Ajax用法,结合实例形式较为详细的分析总结了jQuery中ajax的相关使用技巧,包括ajax请求.载入.处理.传递等,需要的朋友可以参考下 本文实例讲述了j ...
- jQuery 学习笔记:jQuery 代码结构
jQuery 学习笔记:jQuery 代码结构 这是我学习 jQuery 过程中整理的笔记,这一部分主要包括 jQuery 的代码最外层的结构,写出来整理自己的学习成果,有错误欢迎指出. jQuery ...
- jQuery:自学笔记(5)——Ajax
jQuery:自学笔记(5)——Ajax 使用Ajax快捷函数 说明 出于简化AJAX开发工作的流程,jQuery提供了若干了快捷函数. 实例 1.显示 test.php 返回值(HTML 或 XML ...
- jQuery:自学笔记(4)——事件与事件对象
jQuery:自学笔记(4)——事件与事件对象 jQuery中的事件 什么是事件 所谓事件,就是被对象识别的操作,即操作对象队环境变化的感知和反应,例如单击按钮或者敲击键盘上的按键. 所谓事件流,是指 ...
随机推荐
- 设计模式之适配器模式(php实现)
/* github地址:https://github.com/ZQCard/design_pattern * 适配器模式:将一个类的接口转换成客户希望的另外一个接口. * 适配器模式使得原本由于接口不 ...
- 学习一些和redux一样作用的mobx知识
两个组件:mobx和mobx-react 英文文档:https://mobx.js.org/refguide/object.html 中文文档:https://cn.mobx.js.org/ 样例:h ...
- 控制面板cpl大全
ALSNDMGR.CPL AC97 Audio组态设定appwiz.cpl 添加和删除程序bthprops.cpldesk.cpl 显示属性firewall.cpl Windows防火墙hdwwi ...
- hibernate.cfg.xml配置文件对关联关系的书写技巧!
以Department(部门类)和User(用户类)作为例子: 类图如下: 一般hibernate.cfg.xml的配置文件开头都是如下: <?xml version="1.0&quo ...
- Java高级特性—JVM
1).java监控工具使用 jconsole是一种集成了上面所有命令功能的可视化工具,可以分析jvm的内存使用情况和线程等信息 visualvm 提供了和jconsole的功能类似,提供了一大堆的插件 ...
- 使用Kinect2作为Oculus游戏应用的输入设备
注: 文章写于2015年8月, 眼下VR游戏Demo已经完结, 所以把上一次预研的一些经验分享出来, 希望对大家有所帮助 背景 初接触Oculus时, 从网上下载了一大堆的Demo来体验, 可是, 操 ...
- angular controller的一些用法
最近公司的项目是es6+angular.其中的代码格式还在逐步摸索中.感谢今天同事每天帮我解惑. 今天简单梳理一下controller的一些用法 之前看书所熟知的都是 这是最普通的一种 //html ...
- RFS 理解
1.背景 网卡接收一个数据包的情况下,会经过三个阶段: - 网卡产生硬件中断通知CPU有包到达 - 通过软中断处理此数据包 - 在用户态程序处理此数据包 在SMP体系下,这三个阶段有可能在3个 ...
- Bounded Context
From http://martinfowler.com/bliki/BoundedContext.html Bounded Context is a central pattern in Domai ...
- python-mysql-replication
python处理mysql binlog增量日志 http://python-mysql-replication.readthedocs.io/en/latest/examples.html 同样的项 ...