簡體   English   中英

單擊兩個單選框和按鈕時顯示隱藏文本框

[英]Show Hidden Text Box when two radio boxes AND button are clicked

下面是兩個單選按鈕和按鈕的HTML代碼

<body>


    <input data-image="small" type="radio" id="small" name="size" value="20" class="radios1"> 
    <label for="small"><span></span></label> 
    <div class="label">Small</div>    

    <input data-image="green" data-image1="small_green" type="radio" id="green" name="color" value="0" class="radios2" > 
    <label for="green"><span></span></label> 
    <div class="label">Green</div>    

    <button type="button" class="cart-btn" id="cartbutton" name="cart" value="5">Add To Cart!</button>
</body>

這是我到目前為止的腳本。 我讓它只使用單選按鈕工作,但是當我添加按鈕腳本時它停止工作。

<script>

const sizeSelector = 'input:radio[name=size]';
const colorSelector = 'input:radio[name=color]';
const cartSelector = 'input:button[name=cart]';

$(function () {
  
  // We can add the click event to all radio buttons by linking
  // their selectors with commans.
  $(`${sizeSelector}, ${colorSelector}, ${cartSelector}`).click(() => {    
    toggleWhenSmallAndGreenAndCartButton();
  });
  
});

const SMALL = 20;
const GREEN = 0;
const CARTBUTTON = 5;
function toggleWhenSmallAndGreenAndCartButton(){  
  let size = $(`${sizeSelector}:checked`).val();
  let color = $(`${colorSelector}:checked`).val();
  let cart = $(`${cartSelector}:selected`).val();
  $('#itemdv').toggle(size == SMALL && color == GREEN && cart == CARTBUTTON) && $('#itemdv2').toggle(size == SMALL && color == GREEN && cart == CARTBUTTON);
}


</script>

您的按鈕選擇器錯誤,它不是輸入類型。 將其更改為“按鈕[名稱=購物車]”

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM