0

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

EDIT、YES を選択すると 2 つの行が表示されます。その後 NO を選択すると、行は再び消える必要があります。つまり、ユーザーの考えが変わります。

4

1 に答える 1

1

これがあなたのコードです。私はJqueryを使用してテーブルの最後に行を追加しました。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>

`

こちらのデモをご覧ください

更新
デモが更新され、ユーザーが気が変わった場合に追加された行が削除されるようになりました

于 2012-11-02T01:31:47.177 に答える