Question

我有一个小javascript，让我可以显示和隐藏一些textareas。

我从显示的1 textarea开始，另外4个隐藏属性display：none;

第一个textarea显示正确，但是当我运行javascipt以隐藏第一个textare并显示其他textareas时，cols属性不会被重新显示并且textarea显示为小。

这是js代码：

<script language="javascript">
function collapser(tab_id) {

    document.getElementById("new_page_content_it").style.display = "none";
    document.getElementById("new_page_content_en").style.display = "none";
    document.getElementById("new_page_content_fr").style.display = "none";
    document.getElementById("new_page_content_es").style.display = "none";
    document.getElementById("new_page_content_de").style.display = "none";

    document.getElementById(tab_id).style.display = "block";

}
</script>

这里有html：

<div id="new_page_tab_container"> 
    <a href="#" OnClick="javascript:collapser('new_page_content_it')"> 
        <div id="new_page_tab_it">Italian</div> 
    </a> 
    <a href="#" OnClick="javascript:collapser('new_page_content_en')"> 
        <div id="new_page_tab_en">English</div> 
    </a> 
    <a href="#" OnClick="javascript:collapser('new_page_content_fr')"> 
        <div id="new_page_tab_fr">French</div> 
    </a> 
    <a href="#" OnClick="javascript:collapser('new_page_content_es')"> 
        <div id="new_page_tab_es">Spanish</div> 
    </a> 
    <a href="#" OnClick="javascript:collapser('new_page_content_de')"> 
        <div id="new_page_tab_de">German</div> 
    </a> 
</div> 
<div id="new_page_content_it"> 
    <textarea name="content_it" id="content_it" cols="90" rows="40">italian</textarea> 
</div> 
<div id="new_page_content_en"> 
    <textarea name="content_en" id="content_en" cols="90" rows="40">english</textarea> 
</div> 
<div id="new_page_content_fr"> 
    <textarea name="content_fr" id="content_fr" cols="90" rows="40">french</textarea> 
</div> 
<div id="new_page_content_es"> 
    <textarea name="content_es" id="content_es" cols="90" rows="40">spanish</textarea> 
</div> 
<div id="new_page_content_de"> 
    <textarea name="content_de" id="content_de" cols="90" rows="40">german</textarea> 
</div> 
<div id="new_page_save"> 
    <input type="submit" value="Salva"/> 
</div>

css定义content_it可见，但任何其他content_xx为display：none;

为什么cols属性不被引用？但最重要的是......如何摆脱这个问题？

谢谢！

Answer 1

首先，我建议您验证HTML。例如，你在锚元素（内联元素）中有div元素（块元素）是无效的。如果你使用Firefox我可以推荐这个HTML验证器插件：

http://users.skynet.be/mgueury/mozilla/

javascript - textareas没有出现正确的cols

1 个答案: