jQuery的檢查複選框被選中，然後添加值至輸入字段

我有購物車結賬頁面，我想添加一個「禮物」選項。什麼需要發生：一旦爲「Send Order As Gift」選擇了複選框，則需要將值分配給隱藏的輸入字段，以便將信息移動到確認頁面和各種收據上。jQuery的檢查複選框被選中，然後添加值至輸入字段

HTML：

<h3>Send Order As Gift</h3> 
<ul> 
    <li class="fc_row fc_gift"><label for="gift" class="fc_pre">This is a gift, 
    please do not include a receipt.</label> 
    <input type="checkbox" name="gift" id="gift" class="checkbox" value="" /> 
    <input type="hidden" name="Gift" id="gift-true" value="" /></li> 
    <script type="text/javascript"> 
    $(document).ready(function(){ 
     $("#gift-true").input($('#edit-checkbox-id').is(':checked').val() + "Yes"); 
    });     
    </script> 
    </li> 
    <li class="fc_row fc_gift_message"><label for="Gift Message">Include a message 
    (limit 100 characters):</label> 
    <textarea name="Gift Message" cols="50" rows="3" maxlength="100"></textarea> 
    </li> 
</ul>

來源

2012-08-15 RevConcept

你需要更新你的隱藏字段每當複選框發生變化：

$(function(){ 
    $('#gift').change(function() { 
     $("#gift-true").val(($(this).is(':checked')) ? "yes" : "no"); 
    }); 
});

來源

2012-08-15 20:18:38

什麼是'$（'＃ edit-checkbox-id'）'指的是？ – 2012-08-15 20:31:31

只是上面的問題的副本。 $（'＃gift'）應該這樣做。 – 2012-08-16 09:20:45

太棒了！這對我來說非常合適。我改變了一件事（讓我知道你是否預見到這個問題）：'$（「＃gift-true」）.val（（$（this）.is（'：checked'））？「yes」：「「）;'我需要」不「爲空，因爲如果輸入中有任何價值，它就會移到收據上，我不希望購物者看到」禮物：否「，因爲沒有必要。 – RevConcept 2012-08-17 16:57:57

使用jQuery .val()設置輸入元素的值。 jquery .is()返回一個布爾值，所以你必須檢查它是否true（使用if語句或三元操作符像下面），然後有條件地更新值。此外，你應該更新此值whenever the box is selected/unselected：

$(document).ready(function(){ 
    $('#edit-checkbox-id').change(function() { 
     $("#gift-true").val(this.checked ? "Yes" : ""); 
    } 
});

另外，如果您的複選框是：

<input type="checkbox" name="gift" id="gift" class="checkbox" value="" />

適當的ID選擇器是$('#gift')，不~~$('#edit-checkbox-id')~~

來源

2012-08-15 20:12:25 nbrooks

$('#edit-checkbox-id').is(':checked')返回boolean基於複選框狀態的值爲true/false。因此，您應該將其用作條件，並使用val jQuery方法決定設置值。嘗試這個。

$("#gift-true").val($('#edit-checkbox-id').is(':checked') ? "Yes": "No");

來源

2012-08-15 20:16:22 ShankarSangoli

您可以使用CSS僞CLASSE例如：

var checked=$('input[id="#gift-true"]:checked').length; 
var isTrue=false; 
if(checked) 
    isTrue=true; 
else 
    isTrue=false;

來源

2012-08-15 20:26:11 csharp

jQuery的檢查複選框被選中，然後添加值至輸入字段

回答

相關問題