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 相关文章推荐
在线游戏大家来找茬II
Sep 30 Javascript
js截取函数(indexOf,join等)
Sep 01 Javascript
jquery入门—编写一个导航条(可伸缩)
Jan 07 Javascript
javascript Array.prototype.slice的使用示例
Nov 14 Javascript
Android中的jQuery:AQuery简介
May 06 Javascript
jquery+ajax+text文本框实现智能提示完整实例
Jul 09 Javascript
jq checkbox 的全选并ajax传参的实例
Apr 01 Javascript
ES6学习之变量的两种命名方法示例
Jul 18 Javascript
仿vue-cli搭建属于自己的脚手架的方法步骤
Apr 17 Javascript
js实现的订阅发布者模式简单示例
Mar 14 Javascript
jQuery带控制按钮轮播图插件
Jul 31 jQuery
vue 递归组件的简单使用示例
Jan 14 Vue.js
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
盘点被央视点名过的日本动画电影 一部比一部强
2020/03/08 日漫
php实现获取及设置用户访问页面语言类
2014/09/24 PHP
php中Snoopy类用法实例
2015/06/19 PHP
PHP快速排序quicksort实例详解
2016/09/28 PHP
php使用gd2绘制基本图形示例(直线、圆、正方形)
2017/02/15 PHP
PHP开发之用微信远程遥控服务器
2018/01/25 PHP
很全的显示阴历(农历)日期的js代码
2009/01/01 Javascript
javascript 数组学习资料收集
2010/04/11 Javascript
Jquery中getJSON在asp.net中的使用说明
2011/03/10 Javascript
JavaScript中数据结构与算法(二):队列
2015/06/19 Javascript
jQuery中的ajax async同步和异步详解
2015/09/29 Javascript
JS实现的自定义水平滚动字体插件完整实例
2016/06/17 Javascript
ExtJS 4.2 Grid组件单元格合并的方法
2016/10/12 Javascript
react+redux的升级版todoList的实现
2017/12/18 Javascript
vue2.0 实现导航守卫的具体用法(路由守卫)
2018/05/17 Javascript
JS栈stack类的实现与使用方法示例
2019/01/31 Javascript
vue中element 的upload组件发送请求给后端操作
2020/09/07 Javascript
Python中字典和集合学习小结
2017/07/07 Python
python使用threading获取线程函数返回值的实现方法
2017/11/15 Python
python+numpy+matplotalib实现梯度下降法
2018/08/31 Python
python读取和保存图片5种方法对比
2018/09/12 Python
pytorch使用 to 进行类型转换方式
2020/01/08 Python
python计算Content-MD5并获取文件的Content-MD5值方式
2020/04/03 Python
使用jupyter notebook将文件保存为Markdown,HTML等文件格式
2020/04/14 Python
利用matplotlib为图片上添加触发事件进行交互
2020/04/23 Python
Python实时监控网站浏览记录实现过程详解
2020/07/14 Python
python 如何用urllib与服务端交互(发送和接收数据)
2021/03/04 Python
HTML5是否真的可以取代Flash
2010/02/10 HTML / CSS
HTML5 LocalStorage 本地存储刷新值还在
2017/03/10 HTML / CSS
世界上最大的售后摩托车零配件超市:J&P Cycles
2017/12/08 全球购物
大学生饮食连锁店创业计划书
2014/01/17 职场文书
开学典礼决心书
2014/03/11 职场文书
平面设计师岗位职责
2014/09/18 职场文书
团员自我评价范文
2015/03/10 职场文书
环保主题班会教案
2015/08/13 职场文书
《追风筝的人》:人心中的成见是座大山,但请不忘初心
2019/11/15 职场文书