0

假设我有以下代码创建两个单选按钮：

<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 函数 onclick，该函数使用单词“FREE”更新 id 为“mySpan”的 span 的内部 html，否则为“NOT FREE”？

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

3 回答 3

0

我会添加 onclick="setSpan('FREE');" 和 onclick="setSpan('NOT FREE');" 到相应单选按钮的 HTML，然后添加一个 javascript 函数，如下所示设置跨度的 HTML。

function setSpan(text) {
   document.getElementById('mySpan').innerHTML = text;
}
于 2011-01-28T01:25:32.900 回答
0 
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/

于 2011-01-28T01:27:52.867 回答
0

请在单击时检查单选按钮的工作代码！

于 2011-01-28T01:33:36.170 回答