购物车加减

<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. Luogu P6830 [IOI2020]Connecting Supertrees

    题意 好复杂,我就不写了. 题解 口胡了一下,发现我居然会 IOI 的题? 首先发现有 \(3\) 一定不合法,因为连通块里面有一个环的话 \(p_{i,j}\) 最多为 \(2\),有两个环的话就存 ...

  2. [Luogu P2824] [HEOI2016/TJOI2016]排序 (线段树+二分答案)

    题面 传送门:https://www.luogu.org/problemnew/show/P2824 Solution 这题极其巧妙. 首先,如果直接做m次排序,显然会T得起飞. 注意一点:我们只需要 ...

  3. 2018noip游记

    2018noip游记 相隔一年多才想起可以弄一篇博客纪念一下我的首次比赛, 以现在的水平回望过去,发现很好玩很有纪念意义, 于是这篇博客诞生了 \(T1\) 当时的我刚学会什么是字符串,但仍然很不熟练 ...

  4. Oracle(第二天)

    一.外键(foreign key):constraint , refenerces 例如:sno number(7) constraint fk_sno references student(sno) ...

  5. Spider--动态网页抓取--审查元素

    # 静态网页在浏览器中展示的内容都在HTML的源码中,但主流网页使用 Javascript时,很多内容不出现在HTML的源代码中,我们需要使用动态网页抓取技术. # Ajax: Asynchronou ...

  6. 经典c程序100例==81--90

    [程序81] 题目:809*??=800*??+9*??+1 其中??代表的两位数,8*??的结果为两位数,9*??的结果为3位数.求??代表的两位数,及809*??后的结果. 1.程序分析: 2.程 ...

  7. menuconfig

    1. menuconfig 的存在意义 原由是 项目的 config 项太多了,需要一个人性化的方式设置. menuconfig 背后是一个应用程序,用户和该应用程序交互,完成 config 设置. ...

  8. 修改centos6启动动画（plymouth方式）

    centos6默认的启动动画是一个白蓝色的进度条,背景全黑色,现在需要对centos的启动动画进行定制 在查询了一些资料以后,发现有一个软件是可以对启动动画进行定制的,名字叫plymouth 这个在c ...

  9. p5.js基本[一] T型高斯分布的小星星

    样例 <script src="./p5/p5.js"></script> <script> function setup() { // 只写一 ...

  10. 基于gin的golang web开发：集成swagger

    在前后端分离的项目维护一份完整且及时更新的api文档会极大的提高我们的工作效率,传统项目中接口文档都是由后端开发手写的,这种文档很难保证及时性,久而久之便失去了参考意义.swagger给我们提供了一种 ...