根据选择的单选按钮显示行

Question

我已经阅读了许多关于stackoverflow的类似问题，但是对于如何将其修改为我的特定情况却有些困惑。 我想根据选择哪个单选按钮以不同的方式在html中输出2行。 我还在学习javascript ...

我想念什么？ 以及如何获取单选按钮表单项后直接输出的html？

我的表格看起来像这样；

<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>

在此之后，我还有其他几个表单项

在表格的底部，我具有功能；

<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>

编辑 ，如果选择“是”，则会出现两行，如果随后选择了“否”，则该行需要再次消失，即用户改变主意。

Answer 1

这是您的代码，我使用Jquery将行追加到表的末尾。 在这里阅读更多关于.append（）的信息 。

修改后的功能：

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>');
    }
}

修改后的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>

`

在这里查看演示

更新资料
如果用户改变主意，该演示已更新为删除附加的行