jQuery 内容文本值|| 案例：购物车案例模块-增减商品数量 || 案例：购物车案例模块-修改商品小计
生活随笔
收集整理的這篇文章主要介紹了
jQuery 内容文本值|| 案例：购物车案例模块-增减商品数量 || 案例：购物车案例模块-修改商品小计
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
jQuery 內容文本值
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><script src="jquery.min.js"></script> </head><body><div><span>我是內容</span></div><input type="text" value="請輸入內容"><script>// 1. 獲取設置元素內容 html()console.log($("div").html());// $("div").html("123");// 2. 獲取設置元素文本內容 text()console.log($("div").text());$("div").text("123");// 3. 獲取設置表單值 val()console.log($("input").val());$("input").val("123");</script> </body></html>
案例：購物車案例模塊-增減商品數量
案例：購物車案例模塊-修改商品小計
// 3. 增減商品數量模塊 首先聲明一個變量，當我們點擊+號（increment），就讓這個值++，然后賦值給文本框。$('.increment').click(function () {// 得到當前兄弟文本框的值var n = $(this).siblings('.itxt').val()n++$(this).siblings('.itxt').val(n)// 3. 計算小計模塊 根據文本框的值 乘以 當前商品的價格 就是 商品的小計// 當前商品的價格 pvar p = $(this).parents('.p-num').siblings('.p-price').html()p = p.substr(1)var price = (p * n).toFixed(2)// 小計模塊// toFixed(2) 可以讓我們保留2位小數$(this).parents('.p-num').siblings('.p-sum').html('￥' + price)getSum()})$('.decrement').click(function () {// 得到當前兄弟文本框的值var n = $(this).siblings('.itxt').val()if (n == 1) {return false}n--$(this).siblings('.itxt').val(n)// var p = $(this).parent().parent().siblings(".p-price").html();// parents(".p-num") 返回指定的祖先元素var p = $(this).parents('.p-num').siblings('.p-price').html()p = p.substr(1)// 小計模塊$(this).parents('.p-num').siblings('.p-sum').html('￥' + (p * n).toFixed(2))getSum()})
總結
以上是生活随笔為你收集整理的jQuery 内容文本值|| 案例：购物车案例模块-增减商品数量 || 案例：购物车案例模块-修改商品小计的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 自定义动画 animate || 案例：
- 下一篇： jQuery 元素操作——遍历元素