输入框数量加减

不仅仅是一个input框,我们不仅可以在里面直接输入数字,而且我们点击左边或者右边的按钮会实现输入框数量的减少和增加,点击只能增加一个或者减少一个。

效果图

在这里插入图片描述

完整代码

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title></title></head><body><script src="https://code.jquery.com/jquery-3.4.1.min.js"></script><input id="cut" type="button"  value="-" style="color: red;"/><input id="num" type="text" style=" width:200px; text-align:center" value="0"/><input id="add" type="button"  value="+" style="color: blue;"/></body><script type="text/javascript">$(function(){var price=0;$("#cut").click(function(){price=$("#num").val();if($("#num").val()==0){return}else{price--;}$("#num").val(price);})$("#add").click(function(){price=$("#num").val();price++;$("#num").val(price);})})</script>
</html>

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/563911.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

购物车逻辑

当我们添加购物车之后&#xff0c;我们可以点击加减按钮来实现商品数量的增加和减少&#xff0c;当商品数量变化的同时商品的总的价格也是在不停的变化的。 效果图 完整代码 <!DOCTYPE html> <html lang"en"><head><meta charset"UTF-8&…

PowerDesigner详细安装教程

在安装PowerDesigner之前我们要准备好相应的文件&#xff0c;那么我们都需要那些文件的呢&#xff1f; 准备的文件 1、PowerDesigner.exe&#xff1a;安装文件 2、pdflm16.dll&#xff1a;破解文件 3、PowerDesigner汉化文件 PowerDesigner详细安装教程&#xff1a; 1、解压…

GIT更新失败

当我们使用idea对git上的项目进行提交的时候&#xff0c;我们必须要先更新我们的项目&#xff0c;当我们的项目正在运行的时候更新项目是会更新失败的。 项目更新失败错误信息 错误原因 正在运行的项目直接更新会出现如上所示的错误。 解决办法 把正在运行的项目停止运行&a…

Initialization failed for ‘https://start.spring.io‘ Please check URL, network and proxy settings.

1.使用ctrlalts快捷键打开设置界面。 2.选择Appearance & Beahavior -> System Settings-> HTTP Proxy 3.选择第二个:Auto-detet proxy settings 4.点击Check onnetion&#xff0c;在弹出的提示框中输入 https://start.spring.io 后ok即可 5.连接成功

关于exprot 和expert default的区别

首先我们先知道exprot的作用是什么&#xff0c;exprot是用于导出模块&#xff0c;通常配合 improt 使用exprot和exprot default的区别&#xff0c;什么情况下用exprot&#xff0c;什么情况下用exprot default。1.exprot //命名导出&#xff0c;用于导出多个对象 示例代码&#…

如何在Node.js的httpServer中接收前端发送的arraybuffer数据

最近使用了protobuf进行数据交互&#xff0c;发送在node.js接收前端的二进制数据出现了数据错误等问题。后来发现思路上面的问题&#xff0c;在req.on(data,()>{})事件中的处理不适当才引发数据错乱。借此发我先直接贴正确接收二进制数据代码 const server http.createSer…

Mysql 零距离-入门(一)

Mysql是一款非常流行的开源关系型数据库。在许多应用数据存储中都会用到Mysql。后端必备的技能之一&#xff0c;写这篇文章主要是提供Mysql初学者学习使用&#xff0c;有建议之处欢迎大家留言提出。我们先到官网安装Mysql&#xff0c;根据自己系统选择对应的版本 官网地址:htt…

Mysql 零距离-入门(二)

在Mysql中为了更加的清晰的工作&#xff0c;所以定制一套规范和几个常用的命令。下面我将来学习如何创建和操作一个自己的数据库。语法规范 关键字和函数名称必须大写数据库名称&#xff0c;表名称&#xff0c;字段名称必须全部小写SQL语句必须以分号结尾 常用的命令 显示当前…

Mysql 零距离-入门(三)数据类型

在进行数据存储之前&#xff0c;我们先了解一下mysql的数据类型。数据类型是什么呢&#xff1f;数据类型就是指列&#xff1b;存储过程中参数&#xff0c;表达式和局部变量的数据特征&#xff0c;它决定了数据的存储方式&#xff0c;代表了不同的信息类型。整型&#xff1a; 整…

Mysql 零距离-入门(四)创建数据表

数据表是数据库最重要的组成部分之一&#xff0c;是其他对象的基础。如果我们的数据库没有数据表就等于没有真正存储数据的地方打开数据库 我们登录mysql后打开我们想打开的数据库。 USE关键字 我们打开名为test的数据库&#xff0c;命令&#xff1a;USE test 打开数据库后…

Mysql 零距离-入门(五)操作数据表

上一节我们学了如何创建数据表&#xff0c;现在我们来学一下如何操作数据表。数据表插值 操作数据表中最重要的操作&#xff0c;保存我们的网站数据&#xff0c;用户数据。我们先来看一下命令规则&#xff1a; INSERT [INTO] tbl_name [(col_name,col_name,...)] VALUES(val,…

Mysql 零距离-入门(六)数据唯一约束性

在数据记录中我们为保证数据的唯一性&#xff0c;保证用户数据在数据中不出现重复记录。我们需要用到Mysql的主键key&#xff0c;唯一约束。主键约束 PRIMARY KEY 一张数据表中只能存在一个主键字段。并且类型必须为数字。可是设为float类型&#xff0c;但小数点值必须为0和传…

axios添加自定义头部出现的问题

在浏览器的http的GET,POST的跨域请求中&#xff0c;添加自定义头部&#xff0c;发送不是字符串&#xff0c;fromData的数据时&#xff0c;都是非简单请求。浏览器都预先发出OPTIONS&#xff08;预检安全请求&#xff09;。所以我们在axios中添加自定义头部时候需要后端返回OPTI…

GoLand中的指针操作 * 和

&和*这可能是Go中最令人困惑的事情之一。基本上你需要了解3个案例&#xff1a;&操作符 var str string "123" //打印str变量的内存地址 ftm.Println(&str) 获取变量内存地址&#xff0c;需要把 & 放到变量前面 *操作符 myString : "Hi"…

关于 m1 xcode12 编译报错 this target. for architecture arm64等问题解决方案

最近换了 mac m1 开发&#xff0c;xcode12在运行旧项目报错 的问题 xxxx building for iOS Simulator, but linking in object file built for iOS, xxxxx for architecture arm64 上谷歌、百度翻个各种答案&#xff0c;修改 编译结构体、修改pods配置都不行。自己瞎倒腾给解决…

关于 mac m1 xcode12 编译报错 this target. for architecture arm64等问题解决方案

最近换了 mac m1 开发&#xff0c;xcode12在运行旧项目报错 的问题 xxxx building for iOS Simulator, but linking in object file built for iOS, xxxxx for architecture arm64 上谷歌、百度翻个各种答案&#xff0c;修改 编译结构体、修改pods配置都不行。自己瞎倒腾给解…

关于 create-react-app 自定义 eslint文件配置解决方案

create-react-app项目自定义eslitn配置方式 方案一 eject 项目webpack配置进行自定义 这个方案比较low&#xff0c;不建议使用。这里不讲解了。 方案二 在 package.json 中的 script 命令 添加环境变量 EXTEND_ESLINTtreu 开启自定义 react-script4.x版本以下可用这个方案 …

IOS UILabel组件

UILabel 是 IOS 显示文字的组件&#xff0c;继承与UIView 属性 名称类型说明默认值textproperty(nullable, nonatomic,copy) NSString文字nilfontproperty(null_resettable, nonatomic,strong) UIFont字体大小17textColorproperty(null_resettable, nonatomic,strong) UIColor…

IOS 代理模型

代理模式在IOS经常使用&#xff0c;在IOS中使用代理模式非常简单。 A类文件&#xff08;协议&#xff09; a.h 中声明协议 protocol Button <NSObject> // 声明代理协议 - (void) onClick; // 可以代理的方法 - (void) onDown: (UIButton*) event; // 可以代理的方法 e…

IOS UIView 对象详解

UIView 是所有可以显示在屏幕的对象的父类&#xff0c;是一个矩形的对象 名称类型说明默认值boundsCGRect以自己左上角为原点坐标设置位置和尺寸nilframeCGRect以父级视图点左上角为原点设置位置和尺寸niltagNSInteger当前对象点标识&#xff0c;可以当作idnilconterCGPoint视图…