iT邦幫忙

0

在不同的四個 div 中找到個別的 input value

  • 分享至 

  • xImage

如果我有四個沒有 class、id 或 name 的 div,而今天我想計算個別的 input value,

那我該怎麼計算比較好?

<div id="showShoppingCart">
  <div>
    ...
    <input type="text" class="num" name="367303" maxlength="2" value="10">
    ...
  </div>
  <div>
    ...
    <input type="text" class="num" name="367304" maxlength="2" value="10">
    <input type="text" class="num" name="367305" maxlength="2" value="5">
    ...
  </div>
  <div>
    ...
    <input type="text" class="num" name="367306" maxlength="2" value="10">
    ...
  </div>
  <div>
    ...
    <input type="text" class="num" name="367307" maxlength="2" value="20">
    ...
  </div>
</div>

因為我的網站是購物車頁面,可能今天用戶將 name = 367303 的值重新輸入,從 10更改為 5

更改後,JS會計算出最新的數量和價格,然後顯示在頁面上。

但我的 JS 邏輯是這樣的:

newTotalCount = 0;
numAry = [];

$('.num').each(function(){
  newTotalCount += +$(this).val();
    numAry.push($(this).val());
});

var newNum = $('.num').parent().find('input').val();
console.log(newNum);

第一種方法是我用 $('.num').each 用來計算輸入值,Array numAry 是用來存 input value 的,這種方式會計算所有 input value。

另一種方法是用 $('.num').parent().find('input').val(),它用來取得 input value,但是這種方式也會得到五個不同 input 的值,但實際上我只想計算 `name = 367303的值!

qpalzm iT邦新手 1 級 ‧ 2021-09-28 15:33:00 檢舉
如果要抓name = 367303的計算或更改,用$("input[name='367303']").change(function(){
let val=$(this).val();
});
可以試試看,推薦給您
我好像找到答案了XD 謝謝各位的幫忙
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

2 個回答

3

不太清楚你要表達的意思

大概猜你是要更改input後單純在屬於那個input的div做計算?

那我會使用 onchange 或者 blur 搭配closet()做處理

看更多先前的回應...收起先前的回應...

應該說,假如name = 367304的輸入框改變了,從10改成5,那它那個div的數量是不是就從15變成10了,我要的就是計算這個而已。

嗯,那就用change可以解決~
change時實作一function 搭配$(this).closet("div") 可以找到該div~
在運用該div下層的input加總即可

我好像找到答案了XD 謝謝各位的幫忙

Mao iT邦研究生 5 級 ‧ 2021-09-28 17:01:20 檢舉

讚~這個方法快又簡單!

0
Mao
iT邦研究生 5 級 ‧ 2021-09-28 14:57:56

不清楚你想要呈現的功能
但如果是個別找出 input 的值
看你使用的是 jQuery
可以利用 jQuery 的 .change() API

$(".num").change(function(e) {
  const {name, value} = e.target;
  console.log(`${name} : ${value}`);
})

不知道是不是你要的效果
Codepen

參考資料 jQuery API

應該說,假如name = 367304的輸入框改變了,從10改成5,那它那個div的數量是不是就從15變成10了,我要的就是計算這個而已。

我好像找到答案了XD 謝謝各位的幫忙

Mao iT邦研究生 5 級 ‧ 2021-09-28 17:01:38 檢舉

恭喜你~

我要發表回答

立即登入回答