jQuery快速实现商品数量加减的方法


Posted in Javascript onFebruary 06, 2017

废话不多说了,直接给大家贴代码了,具体代码如下所示:

<!-- 快速实现数量加减 -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
//获得文本框对象
var t = $("#text_box");
//初始化数量为1,并失效减
$('#min').attr('disabled',true);
 //数量增加操作
 $("#add").click(function(){ 
  // 给获取的val加上绝对值,避免出现负数
  t.val(Math.abs(parseInt(t.val()))+1);
  if (parseInt(t.val())!=1){
  $('#min').attr('disabled',false);
  };
 }) 
 //数量减少操作
 $("#min").click(function(){
 t.val(Math.abs(parseInt(t.val()))-1);
 if (parseInt(t.val())==1){
 $('#min').attr('disabled',true);
 };
 })
});
</script> 
</head> 
<body> 
<input id="min" name="" type="button" value="-" /> 
<input id="text_box" name="" type="text" value="1" style="width:30px;text-align: center"/> 
<input id="add" name="" type="button" value="+" /> 
</body> 
</html>

实现数量加减,就是这么简单!

以上所述是小编给大家介绍的jQuery快速实现商品数量加减的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
JSON 入门指南 想了解json的朋友可以看下
Aug 26 Javascript
JS+flash实现chrome和ie浏览器下同时可以复制粘贴
Sep 22 Javascript
JS实现金额转换(将输入的阿拉伯数字)转换成中文的实现代码
Sep 30 Javascript
Angular用来控制元素的展示与否的原生指令介绍
Jan 07 Javascript
基于javascript实现表格的简单操作
May 21 Javascript
jquery datatable服务端分页
Aug 31 Javascript
jquery+ajax实现省市区三级联动效果简单示例
Jan 04 Javascript
vue一步步实现alert功能
Jul 05 Javascript
详解Vue微信公众号开发踩坑全记录
Aug 21 Javascript
微信小程序picker组件下拉框选择input输入框的实例
Sep 20 Javascript
基于jquery的on和click的区别详解
Jan 15 jQuery
深入浅析React中diff算法
May 19 Javascript
jQuery EasyUI 页面加载等待及页面等待层
Feb 06 #Javascript
jQuery内容筛选选择器实例代码
Feb 06 #Javascript
jQuery基本筛选选择器实例代码
Feb 06 #Javascript
jQuery层级选择器实例代码
Feb 06 #Javascript
jQuery元素选择器实例代码
Feb 06 #Javascript
对称加密与非对称加密优缺点详解
Feb 06 #Javascript
jquery实现input框获取焦点的方法
Feb 06 #Javascript
You might like
linux下为php添加curl扩展的方法
2011/07/29 PHP
laravel框架实现后台登录、退出功能示例
2019/10/31 PHP
从阿里妈妈发现的几个不错的表单验证函数
2007/09/21 Javascript
jquery Firefox3.5中操作select的问题
2009/07/10 Javascript
jQuery实现的原图对比窗帘效果
2014/06/15 Javascript
基于socket.io和node.js搭建即时通信系统
2014/07/30 Javascript
firefox浏览器用jquery.uploadify插件上传时报HTTP 302错误
2015/03/01 Javascript
jQuery简单实现遍历数组的方法
2015/04/14 Javascript
Javascript验证方法大全
2015/09/21 Javascript
七个不允许错过的jQuery小技巧
2015/12/21 Javascript
jQuery中选择器的基础使用教程
2016/05/23 Javascript
jQuery height()、innerHeight()、outerHeight()函数的区别详解
2016/05/23 Javascript
Web纯前端“旭日图”实现元素周期表
2017/03/10 Javascript
Echarts之悬浮框中的数据排序问题
2018/11/08 Javascript
Vue 2.0双向绑定原理的实现方法
2019/10/23 Javascript
vue实现微信浏览器左上角返回按钮拦截功能
2020/01/18 Javascript
[16:21]教你分分钟做大人:圣堂刺客
2014/12/03 DOTA
Python2.x与Python3.x的区别
2016/01/14 Python
python+Django+apache的配置方法详解
2016/06/01 Python
Python中list初始化方法示例
2016/09/18 Python
Python连接数据库学习之DB-API详解
2017/02/07 Python
Python实现的选择排序算法原理与用法实例分析
2017/11/22 Python
python处理DICOM并计算三维模型体积
2019/02/26 Python
python递归调用中的坑:打印有值, 返回却None
2020/03/16 Python
Pycharm中配置远程Docker运行环境的教程图解
2020/06/11 Python
10种CSS3实现的loading动画,挑一个走吧?
2020/11/16 HTML / CSS
美国汽车交易网站:Edmunds
2016/08/17 全球购物
园长自我鉴定
2013/10/06 职场文书
怎样有效的进行自我评价
2013/10/06 职场文书
品质主管的岗位职责
2013/12/04 职场文书
厂长岗位职责
2014/02/19 职场文书
关于抽烟的检讨书
2014/02/25 职场文书
信息学院毕业生自荐信范文
2014/03/04 职场文书
运动会广播稿200字
2014/10/18 职场文书
项目技术负责人岗位职责
2015/04/13 职场文书
音乐课《小猫钓鱼》教学反思
2016/02/18 职场文书