[英]show row depending what radio button is selected
I have read through a number of similar questions on stackoverflow but am a little lost of how to modify it to my particular situation. 我已经阅读了许多关于stackoverflow的类似问题,但是对于如何将其修改为我的特定情况却有些困惑。 I want to output 2 rows in html differently depending what radio button is selected.
我想根据选择哪个单选按钮以不同的方式在html中输出2行。 I am still learning javascript...
我还在学习javascript ...
What am i missing please? 我想念什么? and how do i get the html to output directly after the radio button form item?
以及如何获取单选按钮表单项后直接输出的html?
My form looks like this; 我的表格看起来像这样;
<tr>
<td>Select your option</td>
<td><input type="radio" name="your_store" id="store_yes" value="1" onclick = "addrow()" />
<?php echo $text_yes; ?>
<input type="radio" name="your_store" id="store_no" value="0" onclick = "addrow()" />
<?php echo $text_no; ?></td>
</tr>
After this i also have several other form items 在此之后,我还有其他几个表单项
At the bottom of the form i have the function; 在表格的底部,我具有功能;
<script type="text/javascript"><!--
function addrow() {
if(document.getElementById('store_yes').checked) {
html = '<tr>';
html = '<td>Row is showing this</td> ';
html = '</tr>';
} else {
html = '<tr>';
html = '<td>Row is showing something else</td> ';
html = '</tr>';
}
//--></script>
EDIT , if YES is selected the 2 rows appear, the rows need to dissapear again if NO is then subsequently selected, ie change of users mind. 编辑 ,如果选择“是”,则会出现两行,如果随后选择了“否”,则该行需要再次消失,即用户改变主意。
Here is your code, I have used Jquery to append the rows to the end of your table. 这是您的代码,我使用Jquery将行追加到表的末尾。 Read more about .append() in jquery here .
在这里阅读更多关于.append()的信息 。
The modified function: 修改后的功能:
function addrow() {
if (document.getElementById('store_yes').checked) {
$('#yourTable').append('<tr><td>Row is showing this</td></tr>');
} else {
$('#yourTable').append('<tr><td>Row is showing something else</td></tr>');
}
}
The modified HTML 修改后的HTML
` `
<table border="1" id="yourTable"><tr>
<td>Select your option</td>
<td><input type="radio" name="your_store" id="store_yes" value="1" onclick = "addrow()" />
<input type="radio" name="your_store" id="store_no" value="0" onclick = "addrow()" />
</td>
</tr>
</table>
` `
Check out the demo here 在这里查看演示
Update 更新资料
The demo has been updated to remove appended rows if the user changes his mind 如果用户改变主意,该演示已更新为删除附加的行
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.