亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何在數組上使用 JQuery 獲取值檢查和取消檢查復選框

如何在數組上使用 JQuery 獲取值檢查和取消檢查復選框

PHP
慕田峪7331174 2023-11-03 20:13:51
現在我正在做 PHP 項目與 JQuery 結合。我想從數組上選中和未選中的復選框獲取值。這是我嘗試的$(function() {      $('.dealprice').on('input', function(){        if($('.dealprice:checkbox:checked').prop('checked')){            //CHECKED            console.log("Checked");            const getPrice = $(this).closest("tr").find('input[name=itemprice]').val();            console.log(getPrice);        }else{            //UNCHECKED            console.log("Uncheck");            const getPrice = $(this).closest("tr").find('input[name=itemprice]').val();            console.log(getPrice);         }            }); });我在這個網站上制作了一個樣本。https://repl.it/@ferdinandgush/get-value-checkbox請單擊頂部的“運行”底部以進行測試。問題是,當復選框選中的數量超過 1 個時,以及當我想取消選中其中的 1 個時。它仍然返回值“True”而不是“false”。我想要什么。每個復選框都可以在我選中和取消選中的地方返回值。檢查退貨consolo.log('true');未經檢查的退貨consolo.log('false');
查看完整描述

2 回答

?
www說

TA貢獻1775條經驗 獲得超8個贊

我相信你可以這樣做if ($(this).prop('checked')) {

然后它只會檢查您單擊的復選框是否被選中。

演示


$(function() {

  $('.dealprice').on('input', function() {


    if ($(this).prop('checked')) {

      //CHECKED

      console.log("Checked");

      const getPrice = $(this).closest("tr").find('input[name=itemprice]').val();

      console.log(getPrice);

    } else {

      //UNCHECKED

      console.log("Uncheck");

      const getPrice = $(this).closest("tr").find('input[name=itemprice]').val();

      console.log(getPrice);

    }


  });

});

.tg  {border-collapse:collapse;border-spacing:0;}

.tg td{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;

  overflow:hidden;padding:10px 5px;word-break:normal;}

.tg th{border-color:black;border-style:solid;border-width:1px;font-family:Arial, sans-serif;font-size:14px;

  font-weight:normal;overflow:hidden;padding:10px 5px;word-break:normal;}

.tg .tg-qh0q{background-color:#c0c0c0;color:#000000;font-weight:bold;text-align:center;vertical-align:top}

.tg .tg-0lax{text-align:left;vertical-align:top}

.tg .tg-amwm{font-weight:bold;text-align:center;vertical-align:top}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table class="tg">

  <thead>

    <tr>

      <th class="tg-qh0q">Item</th>

      <th class="tg-qh0q">Price</th>

      <th class="tg-qh0q">Deal</th>

    </tr>

  </thead>

  <tbody>

    <tr>

      <td class="tg-0lax">Book</td>

      <td class="tg-0lax">$ 10 <input type="hidden" name="itemprice" value="10"></td>

      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][0]"></td>

    </tr>

    <tr>

      <td class="tg-0lax">Pencil</td>

      <td class="tg-0lax">$ 5 <input type="hidden" name="itemprice" value="5"></td>

      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][1]"></td>

    </tr>

    <tr>

      <td class="tg-0lax">Pen</td>

      <td class="tg-0lax">$ 8 <input type="hidden" name="itemprice" value="8"></td>

      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][2]"></td>

    </tr>


    <tr>

      <td class="tg-0lax">spidol</td>

      <td class="tg-0lax">$ 15 <input type="hidden" name="itemprice" value="15"></td>

      <td class="tg-0lax"><input type="checkbox" class="dealprice" name="deal[12][3]"></td>

    </tr>

  </tbody>

</table>


查看完整回答
反對 回復 2023-11-03
?
慕神8447489

TA貢獻1780條經驗 獲得超1個贊

<script>

    $(document).ready(function(){

        $(".dealprice").change(function(){

            if($(this).is(":checked")){

                console.log(true);

            } else {

                console.log(false);

            }

        });

    });

</script>


查看完整回答
反對 回復 2023-11-03
  • 2 回答
  • 0 關注
  • 182 瀏覽

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號