首页 > 其他分享 >jQuery的遍历-prev()和next()方法(购物车数量加减)

jQuery的遍历-prev()和next()方法(购物车数量加减)

时间:2023-04-21 09:56:07浏览次数:40  
标签:jQuery val 元素 value next prev 购物车

jQuery的遍历-prev()和next()方法
<div class="box" id="box">

<a href='#' class="a">       

<input type="text" class="atxt"  value="1">

<a href='#' class="b">       

    </div>

<script>

$(function(){

const $add = $(".b")

const $reduce = $(".a")

$add.click(function () {
        //获取值
        let value = $(this).prev().val()
        // console.log(value)
        value++
        //输出到数量框
        $(this).prev().val(value)
    })
    //减少
    $reduce.click(function () {
        let value = $(this).next().val()
        if (value == 1) return
        value--
        $(this).next().val(value)
    })
ps:1.prev() 获得匹配元素集合中每个元素紧邻的前一个同胞元素

2.next() 获得匹配元素集合中每个元素紧邻的后一个同胞元素

 

标签:jQuery,val,元素,value,next,prev,购物车
From: https://www.cnblogs.com/webSnow/p/17339260.html

相关文章

  • jquery 中获取所有选中的checkbox的用法
    评:jquery中获取所有选中的checkbox的用法$("input:checkbox[name='thecheckboxname']:checked")或者$($("table#tbTemplateinput[type='checkbox']"),function(index,element){if($(element).checked){//keepthestate.......
  • jQuery EasyUI - 进度条
    评:functionprogressbar(){$('#progressbarDiv').window({closable:false});$("#progressbarDiv").window("open");$("#progressbarDiv").css("display","block");$('#p').progre......
  • jquery 验证数字 跟强制输入为数字
    //检查是否是数字functioncheckFloat(obj){vartemp=$(obj).val();varftemp=isNaN(parseFloat(temp))?0:parseFloat(temp);$(obj).val(ftemp);}//检查是否是数字functiongetFloat(val){returnisNaN(parseFloat(val))?0:parseFloat(val);}......
  • jquery
    jQuery教程|菜鸟教程(runoob.com)1、介绍是一个js库,极大简化了js编程。<scriptsrc="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>2、语法jQuery语法是通过选取HTML元素,并对选取的元素执行某些操作。$(selector).action()(1)入口函数$(docu......
  • ajax-jquery
    1、介绍jquery支持ajax,需要导入jsqury库后使用。<scriptsrc="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">2、loadload()方法从服务器加载数据,并把返回的数据放入被选元素中$(selector).load(URL,data,callback);selector:元素选择器url:希望加载的数据来......
  • 事件 jQuery 选择器 筛选器 样式操作 CSS操作 文本操作
    事件事件可以理解为:给HTML标签添加了一些额外的功能,并且能够触发JS的代码运行1.事件就是达到某个触发条件,自动触发的动作2.常用的事件 1.onclick:当用户点击某个对象是调用的事件句柄2.onfoucus:元素获取焦点3.onblur:元素失去焦点4.onchange:域的内容被改变5.onload:......
  • vue3微信公众号商城项目实战系列(9)购物车页面
    本篇显示购物车中的商品,购物车表结构如下,我们通过接口服务抓取登录用户的购物车信息。表名字段功能shoppingcartcart_id(int)购物车编号user_id(int)用户编号goods_id(int)商品编号goods_name(varchar)商品名称photo(varchar)商品图片price(decimal)......
  • jQuery
    目录jQueryjQuery内容jQuery语法标签查找补充:标签对象和jquery对象基本选择器属性选择器表单筛选器表单对象属性筛选器方法样式操作位置操作CSS操作尺寸文本操作属性操作文档处理克隆常见事件事件绑定移除事件阻止后续事件执行阻止事件冒泡页面加载事件委托jQuery优点1.jQuery......
  • Vue进阶(六十二):理解$nextTick()
    一、实例介绍有一个div,默认用了v-if隐藏,点击按钮之后,改变v-if的值让他显示出来,并且取到div中的值:<divid=app><divid="div"v-if="showDiv">我是显示文本</div><button@click="showAndGetText">获取内容</button></div><script>va......
  • jquery遍历节点
    <table><tbody><tr><td><table><tbody><trclass="s">......