购物车加减

<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. 活动可视化搭建系统——你的KPI被我承包了

    前言 对于C端业务偏多的公司来说,在增长.运营等各方同学的摧残下永远绕不过去的一个坑就是大量的H5页面开发,它可能是一个下载.需求告知.产品介绍.营销活动等页面.此类需求都有几个明显的缺点: •开发性 ...

  2. Linux下如何使用X86 CPU的GPIO

    目录 1.前言 2.linux pinctrl子系统 3. pin controller driver 4.手动构造device 1.前言 在arm嵌入式开发中,各个外设具有固定的物理地址,我们可以直 ...

  3. 给萌新HTML5 入门指南（二）

    本文由葡萄城技术团队原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 上一篇我们已经为大家介绍了HTML5新增的内容和基础页面布局,这篇会继续向大 ...

  4. ZOJ 1004 Anagrams by Stack

    Anagrams by Stack 题目链接:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=1004 题意:通过堆栈实现将一 ...

  5. Flink的sink实战之二：kafka

    欢迎访问我的GitHub https://github.com/zq2599/blog_demos 内容:所有原创文章分类汇总及配套源码,涉及Java.Docker.Kubernetes.DevOPS ...

  6. Thinkphp3.2 cms之文章模块

    二.文章模块 <?php namespace Admin\Controller; use Think\Controller; class NewController extends Common ...

  7. C# 字符串处理类

    using System;using System.Collections.Generic;using System.Text;using System.Text.RegularExpressions ...

  8. 回顾MySql的一些基本的增删改查

    ---恢复内容开始--- 回顾数据库的一些简单的增删查改的操作语法与注意点,来自菜鸟教程https://www.runoob.com/mysql/mysql-tutorial.html 关于数据库的操 ...

  9. 【技术分享】小乖乖的 Linux/Ubuntu 历险记

    本文将同步发布于 WHU-TD 的博客. 这是一篇自带故事背景的博客. 总所周知,写的多,错的多,更何况一个刚刚接触 Linux 的小白.虽然只是介绍一些非常基础的内容,还是希望大家在发现错误时可以及 ...

  10. mysql查询上月天数/当月第一天/上月第一天

    select (DATEDIFF(DATE_ADD(curdate(), INTERVAL - DAY(curdate())+ 1 DAY), date_add(curdate()- DAY(curd ...