更改廣播html選擇

Question

我有2個單選按鈕。但是當選擇一個（check1）時，我想更改span.amount html。我會怎麼做呢？

<input type="radio" class="radio-check" name="type" id="check1" value="0" checked /> 
<label for="check1">$99.99</label> 
<input type="radio" class="radio-check" name="type" id="check2" value="1" /> 
<label for="check2">None</label> 

$('#check1').change(function(){ 
    $('amount').html('$99.99')); 
}); 

<button class="btn" type="submit">Pay <span id="amount" class="amount">$249.99</span></button> 

謝謝你的幫忙！

Answer 1

被取消選擇的第一無線電元件時，目前的解決方案不火的change事件。試試這個 - jsFiddle here。

---

的jQuery：

$('input[name=type]').on('change', function(){ 
    $('.amount').html('$99.99'); 
}); 

HTML：

<input type="radio" class="radio-check" name="type" id="check1" value="0" checked /> 
<label for="check1">$99.99</label> 
<input type="radio" class="radio-check" name="type" id="check2" value="1" /> 
<label for="check2">None</label> 

<button class="btn" type="submit">Pay <span class="amount">$249.99</span></button> 

---

我猜你最終想要做的會是這樣的this jsFiddle。

$('input[name=type]').on('change', function(){ 
    if($(this).prop('value') == 1) { 
     $('.amount').html('$99.99'); 
    } 
    else { 
     $('.amount').html('$249.99'); 
    } 
}); 

Answer 2

使用此...

$('#check1').on('change', function(){ 
    $('.amount').html('$99.99'); 
}); 

<input type="radio" class="radio-check" name="type" id="check1" value="0" checked /> 
<label for="check1">$99.99</label> 
<input type="radio" class="radio-check" name="type" id="check2" value="1" /> 
<label for="check2">None</label> 

<button class="btn" type="submit">Pay <span class="amount">$249.99</span></button> 

看到這個jsFiddle Demo

Answer 3

我的回答：fiddle demo

加載在身體負荷的第一個標籤。

然後在每次更改更新量跨度。

CSS：

.amount 
{ 
    background-color: lightblue; 
    padding:5px; 
    margin:10px; 
} 

HTML：

<input type="radio" class="radio-check" name="type" id="check1" value="0" checked /> 
<label for="check1">$99.99</label> 
<input type="radio" class="radio-check" name="type" id="check1" value="1" /> 
<label for="check2">None</label> 
<br /><br /> 
<span class='amount'>here</span> 

腳本：

var load_val = $('.radio-check:checked').next('label').text(); 
$('.amount').text(load_val); 
$('.radio-check').change(function() { 
load_val = $(this).next('label').text(); 
$('.amount').text(load_val); 
});