我正在尝试使用 HTML 表单和一些 JavaScript 执行以下操作:
一个复选框，选中时会动态生成两个单选按钮和一个显示“复选框 1 已选中”的文本。
逻辑(参见 jsFiddle: http://jsfiddle.net/9jPcP/ )确实有效，但由于某种原因，无法选择两个单选按钮。当我点击任一单选按钮时，没有任何反应。如果你们中的任何人对我可能做错的地方提出一些意见，我将不胜感激。
注意:该序列在 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;
}
最佳答案
这是针对您的问题的解决方案:Fix JS Fiddle .
基本上错误的是你的 JS 被加载到 domReady 上然后被丢弃。
你想让它加载到头部。
代码在这里:
<head>
<script type="text/javascript">
//<![CDATA[
function ds() {
var displayVariableExhOptions = "";
var displayText = "";
if (document.input.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;
}
</script>
</head>
<form name="input" action="" method="get">
<input type="checkbox" name="sequenceOP" id="sequenceOP14" onChange="ds();">
Checkbox 1<br/>
<div id="displayText"></div>
<div id="variableSpdExhOptions"></div>
</form>
为了避免您担心 ID，让您自己更轻松一些:
<input type="checkbox" name="sequenceOP" id="sequenceOP14" onChange="ds(this);">
function ds(obj) {
var displayVariableExhOptions = "";
var displayText = "";
if (obj.checked) {
关于javascript - 生成 HTML 表单，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/16716703/