使用Select在Jquery中动态创建/删除表行

我第一次使用Jquery，我应该使用Select标记在表中生成一个表。因为这对我来说是新的，所以我尝试了语法。到目前为止，我已经提出了以下代码：

<select id="theSelect">
    <option value="foo">Foo</option>
    <option value="bar">Bar</option>
</select>


<input id="someInput"/>

<table id="mytable" border="1">
    <tr>
       <th>AAAAA</th>
       <th>BBBBB</th>
    </tr>
    <tr>
       <td>CCCCC</td>
       <td>DDDDD</td>
    </tr>
</table>

<script>
    $("#theSelect").change(function() {
        switch($(this).val())
         {
            case "foo":
                $("#someInput").val("hello");
                $("#mytable").append($("#blarg"))
                break;
            case "bar":
                $("#someInput").val("bye");
                //$("#mytable").remove($("#blarg"))
                $("#mytable").append($("#blah"))
                break;
            default:
                $("#someInput").val("really?");

            }

        }).change();
    </script>


    <div id="blarg">
    <tr><td>hello world</td><td></td></tr>
    </div>


    <div id="blah">
    <tr><td>goodbye world</td><td></td></tr>
    </div>

福
酒吧
AAAA
BBBBB
CCCCC
DDD
$（“#选择”）.change（函数（）{
开关（$（this.val（））
{
案例“foo”：
$（“#someInput”）.val（“你好”）；
$（“#mytable”）.append（$（#blarg”））
打破
案例“酒吧”：
$（“#someInput”）.val（“再见”）；
//$（“#mytable”）。删除（$（“#blarg”））
$（“#mytable”）.append（$（#blah”））
打破
违约：
$（“#someInput”）.val（“真的吗？”）；
}
}).change（）；
你好，世界
再见世界

我得到了要更改的someInputBox值，并设法慢慢修改表值，但我还没有弄清楚如何一次只写一行，这取决于select标记设置的值。我想在选择foo时在表中显示blarg，在选择bar时在表中显示blah。

试试看

<table id="blarg" style="display: none">
    <tr>
        <td>hello world</td>
        <td></td>
    </tr>
</table>
<table id="blah" style="display: none">
    <tr>
        <td>goodbye world</td>
        <td></td>
    </tr>
</table>

演示：

---

清洁的解决方案可以是

非常感谢！！除了上面显示的内容外，我如何使“hello world”和“再见world”只显示在表内而不显示在表外？@Lestat使用`style=“display:none”隐藏这些元素`

$("#theSelect").change(function () {
    var tr;

    var $table = $("#mytable")
    $table.find('.select').remove();
    switch ($(this).val()) {
        case "foo":
            $("#someInput").val("hello");
            tr = '#blarg';
            break;
        case "bar":
            $("#someInput").val("bye");
            tr = '#blah';
            break;
        default:
            $("#someInput").val("really?");

    }
    if(tr){
        $(tr).find('tr').clone().addClass('select').appendTo($table);
    }

}).change();