JavascriptとHTML - onclickの

Question

は、私は2つのラジオボタンを作成し、次のコードがあるとします。

<li id="foli517"  class="  "> 
<label class="desc" id="shippingChoice" for="Field517_0"> 
    Shipping Options 
     </label> 
<div> 
<input id="shippingChoice" name="Field517" type="hidden" value="" /> 
    <span> 
<input id="shipping1"  name="Field517"   type="radio"  class="field radio"   value="$2.00 Shipping Fee"  tabindex="13"      checked="checked"      /> 
<label class="choice" for="Field517_0"  > 
    $2.00 Shipping Fee</label> 
    </span> 
    <span> 
<input id="Field517_1"  name="Field517"   type="radio"  class="field radio"   value="I will pick up the items (free shipping)"  tabindex="14"        /> 
<label class="choice" for="Field517_1"  > 
    I will pick up the items (free shipping)</label> 
    </span> 
    </div> 
</li> 

どのように私はjavascript関数が持つID「mySpan」とスパンの内部HTMLを更新するonclickを実装します2番目のラジオボタンをクリックすると "FREE"と表示され、それ以外の場合は "NOT FREE"と表示されます。

document.getElementById(WHAT GOES HERE).onclick = function() { 
    //what goes here? 
}; 

Answer 1

document.getElementById('foli517').onchange = function(e) { 
    var e = e || event; 
    var target = e.target || e.srcElement; 
    var span = document.getElementById('mySpan'); 
    var span2 = document.getElementById('mySpan2'); 

    if (target.type === "radio") { 
     span.innerHTML = (target.id === "Field517_1") ? "FREE" : "NOT FREE"; 
    } 
    if (target.type === "checkbox") { 
     span2.innerHTML = "Is it checked? " + target.checked; 
    } 
}; 

例：http://jsfiddle.net/pEYnm/2/

Answer 2

私はonclick = "setSpan（ 'FREE'）; and onclick = "setSpan（ 'NOT FREE'）;"それぞれのラジオボタンのHTMLに、スパンのHTMLを設定するjavascript関数を以下のように追加します。

function setSpan(text) { 
    document.getElementById('mySpan').innerHTML = text; 
} 

Answer 3

Working code of Radio button on clickをチェックしてください！