C#.net - 如何使用 JavaScript 在单击按钮时显示动态生成的文本区域?
C#.net - How can I show a dynamically generated textarea on button click using JavaScript?
我想显示基于按钮点击的文本区域。非常简单,但是文本区域和按钮是使用 Knockout js 动态生成的。我当前的代码有效,只是它只扩展了第一个文本区域。显示了几个项目。
HTML(button和textarea是最后两个控件):
<!-- ko foreach: projects -->
<div id="eachOppyProject" style="border-bottom: 1px solid #eee;">
<table>
<tbody>
<tr>
<td><a data-bind="attr: { href: '/tools/oppy/' + guid }" style="font-size: 25px;"><span class="link" data-bind=" value: guid, text: name"></span></a></td>
</tr>
<tr data-bind="text: projectDescription"></tr>
<tr data-bind="text: guid"></tr>
</tbody>
</table>
<span class="forminputtitle">Have you done project this before?</span>
<input type="button" id="oppyBtn" class="btnOppy" onclick="displayTextArea()" value="Yes" />
<textarea id="oppyDoneTextArea" placeholder="Tell us a little of what you've done." style=" display:none; height:75px; " /><br />
</div>
<!-- /ko -->
JavaScript:
function displayTextArea() {
var my_disply = document.getElementById('oppyDoneTextArea').style.display;
if (my_disply == "block")
document.getElementById('oppyDoneTextArea').style.display = "none";
else
document.getElementById('oppyDoneTextArea').style.display = "block";
}
如您所见,控件是根据 Knockout 绑定的对象动态生成的。因此,使用 ID 不是一个好主意,因为它会生成重复的 ID。这就是我现在的问题——这段代码适用于第一个文本区域,但不适用于显示的其余项目。
是因为你的按钮是type=submit
导致回传,改:
<input type="submit" id="oppyBtn" class="btnOppy" onclick="displayTextArea()" value="Yes" />
至
<input type="button" id="oppyBtn" class="btnOppy" onclick="displayTextArea()" value="Yes" />
我想显示基于按钮点击的文本区域。非常简单,但是文本区域和按钮是使用 Knockout js 动态生成的。我当前的代码有效,只是它只扩展了第一个文本区域。显示了几个项目。
HTML(button和textarea是最后两个控件):
<!-- ko foreach: projects -->
<div id="eachOppyProject" style="border-bottom: 1px solid #eee;">
<table>
<tbody>
<tr>
<td><a data-bind="attr: { href: '/tools/oppy/' + guid }" style="font-size: 25px;"><span class="link" data-bind=" value: guid, text: name"></span></a></td>
</tr>
<tr data-bind="text: projectDescription"></tr>
<tr data-bind="text: guid"></tr>
</tbody>
</table>
<span class="forminputtitle">Have you done project this before?</span>
<input type="button" id="oppyBtn" class="btnOppy" onclick="displayTextArea()" value="Yes" />
<textarea id="oppyDoneTextArea" placeholder="Tell us a little of what you've done." style=" display:none; height:75px; " /><br />
</div>
<!-- /ko -->
JavaScript:
function displayTextArea() {
var my_disply = document.getElementById('oppyDoneTextArea').style.display;
if (my_disply == "block")
document.getElementById('oppyDoneTextArea').style.display = "none";
else
document.getElementById('oppyDoneTextArea').style.display = "block";
}
如您所见,控件是根据 Knockout 绑定的对象动态生成的。因此,使用 ID 不是一个好主意,因为它会生成重复的 ID。这就是我现在的问题——这段代码适用于第一个文本区域,但不适用于显示的其余项目。
是因为你的按钮是type=submit
导致回传,改:
<input type="submit" id="oppyBtn" class="btnOppy" onclick="displayTextArea()" value="Yes" />
至
<input type="button" id="oppyBtn" class="btnOppy" onclick="displayTextArea()" value="Yes" />