單選按鈕的條件來設置一個值

-1

我有3個單選按鈕[1天，1周，1月]，最初1天將被選中。我在隱藏字段中都需要starton和expireon值。基於用戶選擇，我必須更新starton和expireon值以跨越標籤。這裏的starton值對於所有3個選擇都是相同的，只有expireon值將根據單選按鈕選擇而改變。任何人都可以幫助我完成此任務。單選按鈕的條件來設置一個值

HTML代碼：

<body> 
    <input type="hidden" id="startOn" value="01/01/2013" /> 
    <input type="hidden" id="expireDay" value="01/01/2013" /> 
    <input type="hidden" id="expireWeek" value="01/07/2013"> 
    <input type="hidden" id="expireMonth" value="01/31/2012" /> 
    <input type="radio" id="packageAmt1" name="packageAmt" checked="checked">1 Day</input> 
    <input type="radio" id="packageAmt2" name="packageAmt">1 Week</input> 
    <input type="radio" id="packageAmt3" name="packageAmt">1 Month</input> 
    <br/>Start on<span id="startOnValue" /></span> 
    <br/>Expire on<span id="expireOnValue" /></span> 
</body> 

jQuery Code: 

$(document).ready(function() { 
    var starton = $('#startOn').val() 
    var expireday = $('#expireDay').val() 
    var expireweek = $('#expireWeek').val() 
    var expiremonth = $('#expireMonth').val() 
    $('#startOnValue').text(starton); 
    $('#expireOnValue').text(expireday); 
    $('input[type=radio]').change(function() { 

    }); 
});

來源

2013-05-02 SPN

輸入標籤不能像那樣工作。' text' – Popnoodles 2013-05-02 13:08:55

你可以不喜歡它這

http://jsfiddle.net/sHHDF/

HTML

<input type="hidden" id="startOn" value="01/01/2013"/> 
     <input type="hidden" id="expireDay" value="01/01/2013"/> 
     <input type="hidden" id="expireWeek" value="01/07/2013"> 
     <input type="hidden" id="expireMonth" value="01/31/2012"/> 

     <input type="radio" id="packageAmt1" value="1" name="packageAmt" checked="checked">1 Day</input> 
     <input type="radio" id="packageAmt2" value="2" name="packageAmt">1 Week</input> 
     <input type="radio" id="packageAmt3" value="3" name="packageAmt">1 Month</input><br/> 

     Start on<span id="startOnValue" /></span><br/> 
     Expire on<span id="expireOnValue" /></span>

jQuery的

var starton = $('#startOn').val() 
      var expireday = $('#expireDay').val() 
      var expireweek = $('#expireWeek').val() 
      var expiremonth = $('#expireMonth').val() 
      $('#startOnValue').text(starton); 
      $('#expireOnValue').text(expireday); 

     $('input[type=radio]').change(function() 
     { 
      var value_radio = $(this).val(); 

      if(value_radio == 1){ 

       $('#expireOnValue').html($('#expireDay').val()); 

      } 
      if(value_radio == 2){ 

       $('#expireOnValue').html($('#expireWeek').val()); 

      } 
      if(value_radio == 3){ 

       $('#expireOnValue').html($('#expireMonth').val()); 

      } 

     });

來源

2013-05-02 13:04:12 Johnny000

但是爲了更好的練習，你可以在沒有if/else叢林的情況下做到這一點嗎？ – Popnoodles 2013-05-02 13:06:40

你已經做到了; D – Johnny000 2013-05-02 13:11:22

我知道，但我戳你，因爲它總是很好，寫一些東西，然後細化它:) – Popnoodles 2013-05-02 13:14:09

好吧，看來你要採取從一個隱藏字段的值，並把它的跨度取決於選定的電臺。

所有輸入標籤語法的拳頭都是錯誤的。併爲此添加一個值。

<label><input type="radio" name="packageAmt" value="expireDay" checked="checked"/>1 Day</label> 
<label><input type="radio" name="packageAmt" value="expireWeek"/>1 Week</label> 
<label><input type="radio" name="packageAmt" value="expireMonth"/>1 Month</label>

和您的跨度語法是錯誤的

<br/>Start on <span id="startOnValue"></span> 
<br/>Expire on <span id="expireOnValue"></span>

$('input[name="packageAmt"]').change(function(){ 

    // you could do in one line 
    // $('#expireOnValue').text($('#' + $(this).val()).val()); 
    // but for easier reading... 

    // get the value of the input whose ID is the VALUE of this radio 
    var selector='#' + $(this).val(); 
    var text=$(selector).val(); 

    // put it in the span 
    $('#expireOnValue').text(text); 

}).first().trigger('change'); // trigger on page load to catch the default

（未測試）

來源

2013-05-02 12:53:25 Popnoodles

你所做的工作的99％了。在空函數體內部，使用：

$('#expireOnValue').innetText = $('radio:checked')[0].innerText;

來源

2013-05-02 12:54:59 Renan

有了一點HTML eiditing，你可以像這樣得到它。請注意，我說data-屬性指向其輸入的選擇負責

HTML

<input type="hidden" id="startOn" value="01/01/2013" /> 
<input type="hidden" id="expireDay" value="01/01/2013" /> 
<input type="hidden" id="expireWeek" value="01/07/2013"> 
<input type="hidden" id="expireMonth" value="01/31/2013" /> 
<input type="radio" id="packageAmt1" data-expire='expireDay' name="packageAmt" checked="checked">1 Day</input> 
<input type="radio" id="packageAmt2" data-expire='expireWeek'name="packageAmt">1 Week</input> 
<input type="radio" id="packageAmt3" data-expire='expireMonth' name="packageAmt">1 Month</input> 
<br/>Start on <span id="startOnValue"></span> 

<br/>Expire on <span id="expireOnValue"></span>

的JavaScript

$(document).ready(function() { 
    var starton = $('#startOn').val() 
    var expireday = $('#expireDay').val() 
    var expireweek = $('#expireWeek').val() 
    var expiremonth = $('#expireMonth').val() 
    $('#startOnValue').text(starton); 
    $('#expireOnValue').text(expireday); 

    $('input[type=radio]').change(function() { 
     var iid = $(this).data('expire'); 
     var date = $('#'+iid).val(); 
     $('#expireOnValue').text(date); 
    }); 
});

FIDDLE http://jsfiddle.net/UxTWt/

來源

2013-05-02 13:00:43 Spokey

我假設'expireMonth'值是一個錯字問題。 – 2013-05-02 13:10:59

OP的輸入寫出錯 – Popnoodles 2013-05-02 13:12:19

我用OP的代碼並沒有看到。 – Spokey 2013-05-02 13:20:41

JSFiddle

HTML：

<input type="hidden" id="startOn" value="01/01/2013"/> 
<input type="hidden" id="expireDay" value="01/01/2013"/> 
<input type="hidden" id="expireWeek" value="01/07/2013"> 
<input type="hidden" id="expireMonth" value="01/31/2012"/> 
<label for="packageAmt2">1 Day</label> 
<input type="radio" id="packageAmt1" name="packageAmt" checked="checked" value="expireday" /> 
<label for="packageAmt2">1 Week</label> 
<input type="radio" id="packageAmt2" name="packageAmt" value="expireweek" /> 
<label for="packageAmt2">1 Month</label> 
<input type="radio" id="packageAmt3" name="packageAmt" value="expiremonth" /> 
<br/> 
Start on <span id="startOnValue"></span><br/> 
Expire on <span id="expireOnValue"></span>

JS：

var values = { 
    starton: $('#startOn').val(), 
    expireday: $('#expireDay').val(), 
    expireweek: $('#expireWeek').val(), 
    expiremonth: $('#expireMonth').val() 
}; 
$('#startOnValue').text(values['starton']); 
$('#expireOnValue').text(values['expireday']); 
$('input[type=radio]').change(function() { 
    $('#startOnValue').text(values['starton']); 
    $('#expireOnValue').text(values[$(this).val()]); 
});

來源

2013-05-02 13:08:40

快速FYI，如果你只是用輸入標籤 – 2013-05-02 13:15:01

包裝輸入，不需要'for'謝謝！相關提示 – 2013-05-02 13:22:06

你有你的跨度標記問題 - 關閉標籤，然後添加一個結束標記。 /></span>

$(document).ready(function() { 
    $('#startOnValue').text($('#startOn').val()); 
    $('#expireOnValue').text($('#expireDay').val()); 
    $('input[type=radio]').change(function() { 
     var i = $('input[type=radio]').index(this) + 1; 
     $('#expireOnValue').text($('input[type=hidden]').eq(i).val()) 
    }); 
});

來源

2013-05-02 13:08:44

注意：如果您添加更多隱藏值，則需要對它們進行分組。可能與類最好，然後選擇，否則索引會改變。 – 2013-05-02 13:10:04

單選按鈕的條件來設置一個值

回答

相關問題