0

JQUERYはありません!ユーザーが[赤ちゃんを産む]または[軍隊を離れる]を選択すると、ラジオボタンがポップアップします。選択したボタンの値を取得し、id="choice"を含むinnerHTMLを値に変更するのに問題があります。誰か助けてもらえますか?

http://jsfiddle.net/73Vq9/

<html>
<head>
<script>
//this function deals with changing the event
function changeMessage(oElement) {
    //have a baby
    if (oElement.value == "100") {
        document.getElementById("btn").style.display = "none";
        document.getElementById("radio").style.display = "inline-block";
        document.getElementById("rd1").innerHTML = "C-Section";
        document.getElementById("rd2").innerHTML = "Regular Birth";
        document.getElementById("rd1").value = "C-Section";
        document.getElementById("rd2").value = "Regular Birth";
    //military leave
    } else if (oElement.value == "15") {
        document.getElementById("btn").style.display = "none";
        document.getElementById("radio").style.display = "inline-block";
        document.getElementById("rd1").innerHTML = "Training";
        document.getElementById("rd2").innerHTML = "Active Duty";
        document.getElementById("rd1").value = "Training";
        document.getElementById("rd2").value = "Active Duty";
    //no value, the first, blanck value
    } else if (oElement.value == "0") {
        document.getElementById("btn").style.display = "none";
        document.getElementById("radio").style.display = "none";

    } else {
        document.getElementById("btn").style.display = "inline-block";
        document.getElementById("radio").style.display = "none";
    }
    return;
}
</script>
</head>
<body>


<div style="margin-left:250px;">
<select id="leave" onchange="changeMessage(this);">
  <option value="0"></option>
  <option value="5">Get Married</option>
  <option value="100">Have a Baby</option>
  <option value="90">Adopt a Child</option>
  <option value="35">Retire</option>
  <option value="15">Military Leave</option>
  <option value="25">Medical Leave</option>
</select>
 <button id="btn" style="display:none" onclick="getInfo()"type="button">Process</button>
</div>
<div id="radio" style="display:none">
    <div id="rd1"></div><input type="radio" name="sex" value="" />
    <div id="rd2"></div><input type="radio" name="sex" value=""/>
</div>
    <div id="choice">Radio Choice</div>
4

1 に答える 1

2

inputが設定されることはないため、常にnullになります。

前の質問https://stackoverflow.com/questions/12091968/javascript-function-not-changing-input-typesでコードを変更したときに、idをからに移動inputした<div>ため、JavaScriptが入力の値を設定しなくなりました。

JavaScriptを変更して入力を正しく設定してから、次のようにする必要があります。

HTML

<input type="radio" name="sex" value="" onclick="showChoice(this)"/>

JavaScript

function showChoice(input) {
    document.getElementById('choice').innerHTML = "Radio Choice=" + input.value;
}

選択した入力の値をに追加する必要があります<div id="choice">

于 2012-08-23T13:25:24.360 に答える