Question

我试图用一些javascript在tbody中显示隐藏的内容。

两个问题。

首先，我不能让我的jsfiddle工作。

该脚本正在我的服务器上运行......但它不适用于jsfiddle。我必须做一些愚蠢但却看不到的东西。

在解决了真正的问题是它显示内容时，它没有以相同的宽度显示它，即100％而只是文本的长度。将不胜感激任何关于这里有什么问题的建议。

与小提琴相同的代码：

HTML

<table>
    <tbody>
        <tr style="background-color:blue;width:100%;height:30px;">
            <td>This is always here no matter what</td>
        </tr>
        <tr style="background-color:blue;width:100%;height:30px;">
            <td>
                <a href="javascript:void();" onclick="showMore();">Show More</a>
            </td>
        </tr>
    </tbody>
    <tbody id="more" style="display:none;">
        <tr style="background-color:blue;width:100%;height:30px;">
            <td>This is hidden</td>
        </tr>
    </tbody>
</table>

JS：

function showMore() {
    alert("hi");
    document.getElementById("more").style.display="block";
}

更新：

我更新了它，所以小提琴现在起作用，更好地说明了蓝色背景的问题。显示的隐藏文本与表中其他行的宽度不同。

Answer 1

如果您真的不需要2 tbody个部分，请查看此fiddle

javascript：显示隐藏文字的正确宽度

1 个答案: