购物车加减

<head>

	<meta charset="UTF-8">

	<title>加减购物车</title>

	<style type="text/css">

		input {

			width: 35px;

			height: 35px;

			font-size: 20px;

			text-align: center;

		}

	</style>

	<script src="js/jquery-3.3.1.min.js"></script>

	<script>

		$(function() {

			$("input[value='-']").click(function() {

				var $txt = $(this).next("input");

				var num = parseInt($txt.val());

				if(num - 1 >= 0) {

					$txt.val(num - 1);

				}

			});

			$("input[value='+']").click(function() {

				var $txt = $(this).prev("input");

				var num = parseInt($txt.val());

				$txt.val(num + 1);

			});

		});

	</script>

</head>

<body>

	<p>

		<input type="button" value="-" />

		<input type="text" value="1" />

		<input type="button" value="+" />

	</p>

	<p>

		<input type="button" value="-" />

		<input type="text" value="1" />

		<input type="button" value="+" />

	</p>

</body>

JQuery案例：购物车加减的更多相关文章

  1. 【小程序开发】购物车加减几件demo

    <!-- 主容器 --> <view class="stepper"> <!-- 减号 --> <text class="{{m ...

  2. js实现仿购物车加减效果

    代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <tit ...

  3. js jquery 权限单选 bug修改以及正确代码 购物车数量加减

    效果图废话不多直接上代码 用的avalon渲染,其实都是一样的 <div class="shop-arithmetic"> <a href="javas ...

  4. jQuery实现购物车多物品数量的加减+总价计算

        <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3. ...

  5. Jquery实现购物车物品数量的加减特效

    今天网友翠儿在用Jquery实现购物车物品数量的加减特效的时候遇到问题来问我,我后来帮她解决了这个Jquery特效,现在把它整理出来分享给大家用,虽然功能比较简单,但是很实用. 主要包括了以下功能: ...

  6. jQuery实现购物车多物品数量的加减+总价+删除计算

    <?php session_start(); ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//E ...

  7. jQuery实现购物车物品数量的加减

    基于jquery的一款代码,实现购物车数据的加减,在淘宝网.京东商城购物时时经常见到的一个功能,点击文本框两侧的“+”与“-”,就可以增加或减少文本框内的数字值,每次步长为1,当然这个是可以自己设置的 ...

  8. JQuery购物车多物品数量的加减+总价计算

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. Vue(小案例_vue+axios仿手机app)_购物车（二模拟淘宝购物车页面，点击加减做出相应变化）

    一.前言 在上篇购物车中,如果用户刷新了当前的页面,底部导航中的数据又会恢复为原来的: 1.解决刷新,购物车上数值不变                                         ...

随机推荐

  1. 关于sql的随笔（标识列 即自动增长列）

    一.标识列的定义以及特点SQL Server中的标识列又称标识符列,习惯上又叫自增列.该种列具有以下三种特点:1.列的数据类型为不带小数的数值类型2.在进行插入(Insert)操作时,该列的值是由系统 ...

  2. Azure Data Factory（一）入门简介

    一,引言 今天分享一个新的Azure 服务-----Azure Data Factory(Azure 数据工厂),怎么理解,参考根据官方解释-----数据工厂解释:大数据需要可以启用协调和操作过程以将 ...

  3. Scrapy加Redis加IP代理池实现音乐爬虫

    音乐爬虫 关注公众号"轻松学编程"了解更多. 目的:爬取歌名,歌手,歌词,歌曲url. 一.创建爬虫项目 创建一个文件夹,进入文件夹,打开cmd窗口,输入: scrapy star ...

  4. c#三角形

    int n = 10; for (int i = 1; i <= n; i++) { Console.Write(new string(' ', n - i)); for (int j = 1; ...

  5. leetcode6:binary-tree-postorder-traversal

    题目描述 求给定的二叉树的后序遍历. 例如: 给定的二叉树为{1,#,2,3}, 1↵ ↵ 2↵ /↵ 3↵ 返回[3,2,1]. 备注:用递归来解这道题太没有新意了,可以给出迭代的解法么? Give ...

  6. 在java9+版本中，接口的内容和注意

    1.成员变量其实就是常量,格式: [public] [static] [final] 数据类型 常量名称 = 数据值: 注意: 常量必须进行赋值,而且一旦赋值不能改变. 常量名称完全大写,用下划线进行 ...

  7. Pandas_VBA_数据筛选比较

    Pandas与VBA筛选数据的比较 Author:Collin_PXY 需求: 将B列里值为Completed 和 Pending的A,B,D三列数据筛选出来,新建一个名为 Filited_data的 ...

  8. Docker - 解决重新进入容器后，环境变量失效的问题

    问题背景 在容器中,在 /etc/profile . /etc/environment 设置了环境变量 退出容器,重新进入容器 刚刚设置的环境变量失效了 解决办法 将环境变量设置在 /root/.ba ...

  9. gdb调试入门（上）

    一.什么是gdb:gdb是GNU debugger的缩写,是编程调试工具二.gdb功能:1.启动程序,可根据用户要求随心所欲的运行程序(比如带参数)2.可让被调试的程序在用户指定的调试的断点处停住3. ...

  10. 【java从入门到精通】day-06-基本运算符-自增自减运算符

    1.运算符 java语言支持如下运算符: 算术运算符:+,-,*,/,%,++,-- 赋值运算符:= 关系运算符:>,<,>=,<=,==,!=,instanceof 逻辑运算 ...