javascript - 隐藏表中的特定行？

Question

在选择下拉字段:数据库时，我想隐藏特定的行，但只隐藏数据库下的字段。如何只隐藏行的一部分，同时保留其他行？我尝试使用 JQUERY 并将 ID 附加到该行，但整行都在删除，我想保留右侧。

我知道我可以设置 style visibility: hidden，但如果不需要这些字段，我希望这些行消失并向上移动。

    <tr>
<th>* Database</th>
<th class="th_background" style="border-right-style: groove;"><select id="database" class="form-control" name="database" onchange="database_details()">
                        <option value="oracle" selected="selected">Oracle</option>
                        <option value="mssql">Sql Server</option>
                        <option value="teraData">TeraData</option>
                        <option value="epic">Generic ODBC(Chronicles)</option>
                        <option value="sas">SAS</option>
                </select>
                </th>
                <th class="th_background"><input type="radio" name="refreshTde"
                    value="yes" checked> <span data-toggle="tooltip"
                    title="This option creates new TDE or replaces existing TDE file with full data.">Full
                        Refresh <i class="fa fa-question-circle"></i></span></th>
                <th class="th_background"><input type="radio" name="refreshTde"
                    value="no"> <span data-toggle="tooltip"
                    title="This option appends existing TDE. Should have same data items in the SQL.">Incremental
                        Refresh <i class="fa fa-question-circle"></i></span></th>

</tr>

<tr>
<th>* Service ID</th>
                <th class="th_background"><input type="text" id="sidText"
                    name="sid" class="form-control" style="width: 100%" placeholder="Enter SID"></th>
<th colspan="2" style="background-color: #0072bc;"><span
                    style="color: white;">* SQL Query to Generate TDE</span></th>

我只想隐藏和折叠这部分:

<th>* Service ID</th>
<th class="th_background"><input type="text" id="sidText"
name="sid" class="form-control" style="width: 100%" placeholder="Enter SID"></th>

http://jsfiddle.net/wf7j5tn8/

Answer 1

如果我对您的问题的理解正确，您应该能够向要隐藏的元素添加一个类，然后使用该类将“显示:无”应用于这些元素。

这是你的 fiddle更新了我的意思。

这是来自那个 fiddle 的相关代码:

HTML

<th class="hidden">* Service ID</th>
<th class="th_background hidden"><input type="text" id="sidText"
  name="sid" class="form-control" style="width: 100%" placeholder="Enter 
  SID">
</th>

CSS

.hidden {
  display: none;
}