jQueryフォームの処理

Question

ラジオボタンを使用して電話機とプランを選択する製品選択ページがあります。「現在の選択」を表示するにはjQueryが必要です。

ノキアN95とNokia N96、$ 35 /月、$ 50 /月

これらの「オプション」の各それが自身のラジオボタンのしている：たとえば、私は2台の2つのプランと携帯電話を持っています。

あなたの現在の注文
電話：ノキアN95
プラン：$ 50 /月

すべてのヘルプN95、$ 50 /月のプランが選択されているとき、私はdivの中にこの情報を表示する必要があります大変感謝しています！ :)

Answer 1

<script> 
$(document).ready(function(){ 
     $("div.plan").hide(); 

     $("input[type=radio]").click(function(){ 
      $("div.plan").hide(); 
      $("div[planid=" + $(this).val() +"]").show(); 
     }); 
}); 
</script> 

<input type="radio" name="plan" value="1" /> Plan 1 <br /> 
<input type="radio" name="plan" value="2" /> Plan 2 <br /> 
<input type="radio" name="plan" value="3" /> Plan 3 <br /> 

<div class="plan" planid="1">Plan 1 details</div> 
<div class="plan" planid="2">Plan 2 details</div> 
<div class="plan" planid="3">Plan 3 details</div> 

Answer 2

これは非常に柔軟でなければなりません。これは、すべての組み合わせを事前に定義する必要がないようにします。ラジオボックスに入れるオプションに合わせて適応します。いずれかのオプションが選択されるとすぐに要約が表示されます（プラン/電話）。のビットと、

<script> 
$(document).ready(function(){ 
     $("input[name=plan]").click(function(){ 
      $("#plan_details").html($(this).val()); 
      $("#summary").show(); 
     }); 
     $("input[name=phone]").click(function(){ 
      $("#phone_details").html($(this).val()); 
      $("#summary").show(); 
     }); 
}); 
</script> 

<div id="summary" style="display: none;"> 
<strong>Phone:</strong><span id="phone_details">None Selected</span><br /> 
<strong>Plan:</strong><span id="plan_details">None Selected</span> 
</div> 

<strong>Select Your Plan:</strong><br /> 
<input type="radio" name="plan" value="$35/month" />$35/month<br /> 
<input type="radio" name="plan" value="$50/month" />$50/month<br /> 

<strong>Select Your Phone:</strong><br /> 
<input type="radio" name="phone" value="Nokia N95" />Nokia N95<br /> 
<input type="radio" name="phone" value="Nokia N96" />Nokia N96<br />