1

HTMLフォームといくつかのJavaScriptで次のことをしようとしています:

チェックすると、2 つのラジオ ボタンが動的に生成され、「チェックボックス 1 がチェックされています」というテキストが生成されるチェックボックス。

ロジック (jsFiddle: http://jsfiddle.net/9jPcP/に表示) は機能しますが、何らかの理由で 2 つのラジオ ボタンを選択できません。どちらかのラジオ ボタンをクリックしても何も起こりません。私が間違っているかもしれないことについて、あなたの誰かが何らかの意見を持っていれば幸いです。

注: シーケンスは jsFiddle では機能しないようですが (ラジオ ボタンは実際に動的に生成されます)、私のワークステーションでは機能します。

HTML コード:

<form name="input" action="" method="get">
<input type="checkbox" name="sequenceOP" id="sequenceOP14" onChange="displaySequence()">
Checkbox 1<br/>
<div id="displayText"></div>
<div id="variableSpdExhOptions"></div>
</form>

JavaScript:

function displaySequence(){
var displayVariableExhOptions = "";
var displayText = "";
if(sequenceOP14.checked){
displayText += "Checkbox 1 is checked";
displayVariableExhOptions += "<input type=\"radio\" name=\"exhOptions\" id=\"sequenceOP15\" onChange=\"displaySequence()\" >"
+ "Radio Box 1<br/>"
+ "<input type=\"radio\" name=\"exhOptions\" id=\"sequenceOP16\" onChange=\"displaySequence()\" >"
+ "Radio Box 2<br/>"
}
document.getElementById("variableSpdExhOptions").innerHTML = displayVariableExhOptions;
document.getElementById("displayText").innerHTML = displayText;
}
4

3 に答える 3

1

Where does your "sequenceOP14" comes from?

You need to pass the checkbox to your javascript function like this:

<input type="checkbox" name="sequenceOP" id="sequenceOP14" onChange="displaySequence(this)">

Then in your javascript function:

function displaySequence(htmlCheckableElement){
    if(typeof(htmlCheckableElement) == "undefined")
        return;
    var displayVariableExhOptions = "";
    var displayText = "";
    if(htmlCheckableElement.checked){
        displayText += "Checkbox 1 is checked";
        displayVariableExhOptions += "<input type=\"radio\" name=\"exhOptions\"                         id=\"sequenceOP15\" onChange=\"displaySequence()\" >"
        + "Radio Box 1<br/>"
        + "<input type=\"radio\" name=\"exhOptions\" id=\"sequenceOP16\" onChange=\"displaySequence()\" >"
        + "Radio Box 2<br/>"
        }
        document.getElementById("variableSpdExhOptions").innerHTML = displayVariableExhOptions;
        document.getElementById("displayText").innerHTML = displayText;
    }
}
于 2013-05-23T14:48:38.100 に答える