Javascript隐藏和显示div的动态内容

目前，我隐藏并显示div的内容，如下所示：

var header = null;
        var content = null;
        var mainHolder = null;
        var expandCollapseBtn = null;
        var heightValue = 0;

        header = document.getElementById("header");
        content = document.getElementById("content");
        mainHolder = document.getElementById("mainHolder");
        expandCollapseBtn = header.getElementsByTagName('img')[0];

        heightValue = mainHolder.offsetHeight;

        header.addEventListener('click', handleClick, false);
        mainHolder.addEventListener('webkitTransitionEnd',transitionEndHandler,false);

        function handleClick() {
            if(expandCollapseBtn.src.search('collapse') !=-1)
            {
                mainHolder.style.height = "26px";
                content.style.display = "none";
            }
            else
            {
                mainHolder.style.height = heightValue + "px";
            }
        }

    function transitionEndHandler() {
        if(expandCollapseBtn.src.search('collapse') !=-1)
        {
            expandCollapseBtn.src = "expand1.png";
        }
        else{
            expandCollapseBtn.src = "collapse1.png";
            content.style.display = "block";
        }
    }

如果内容是静态的，这很好，但是我正试图像这样动态地填充我的div

这是从iphone应用程序调用的，并用字符串填充div

var method;

            function myFunc(str)
            {
                method = str;
                alert(method);
                document.getElementById('method').innerHTML = method;
            }

我将字符串全局存储在variable方法中。我现在遇到的问题是，当我尝试扩展刚刚折叠的div时，那里什么都没有。在再次扩展div之前，我是否可以使用var中存储的信息重新填充div？我试着像在函数中那样插入它，但它不起作用

有人有什么想法吗

复制：

这是jsfiddle。jsfiddle.net/6a9B3，如果您在 这里

它可以正常工作。我不确定 如何在这个JSFIDLE中仅使用字符串调用一次myfunc，但如果 你可以想出如何做到这一点，你会看到它加载好的第一 时间，但当您折叠该部分并尝试重新打开它时，它 行不通

---

如果解决这个问题的唯一方法是使用jquery，我不介意这样做。

它在其他浏览器中工作吗

你们能为目前的功能，因为它是很难理解的上下文中的问题，这样的代码拍摄

有很多建议：）但我有强烈的感觉

 document.getElementById('method') 

返回错误的元素或此元素未放置在mainHolder中

更新：在JSFIDLE中查看样本后

对错误元素的感觉是正确的：）将“方法”更改为“信息”

document.getElementById('method') -> document.getElementById('info')

---

我认为您希望在myFunc中使用document.getElementById（'content'），而不是document.getElementById（'method'）

我真的看不出这段代码有什么问题。然而，一个你可以探索的猜测是改变这条线

content.style.display=“无”

在这种情况下，显示html的任何内容（webview或浏览器本身）都可能会擦除元素的内容，因为显示设置为
none
是否有不能使用jQuery的原因？我建议你去看看。有了它，它将像
$（“#div id”）.show（）一样简单
和
$（“#div id”）.hide（）分别显示和隐藏您的div。原因是在内容动态之前，它在iphone上运行得非常好。我对javascript或jquery不太了解，您能告诉我如何使用jquery来实现这一点吗？我需要包括哪些jquery库？从您在这里编写的代码中，我看不出有什么错误。它看起来不像是用id“method”清除元素的内容，所以应该保持不变。您能提供更多的上下文吗？@dev6546提供一些html将使每个人的生活更轻松，因此我们可以看到您的dom是如何布局的，如果您在此处之间键入文本，它将正常工作。我不确定如何在这个JSFIDLE中只使用字符串调用一次myfunc，但是如果您能够解决如何调用，您将看到它第一次加载正常，但是当您折叠该节并尝试重新打开它时，它将不起作用。document.getElementById（'method'）。innerHTML=method；将其更改为document.getElementById（'info'）。innerHTML=method；一切都会很好…嗨，我已经照你说的做了，这是视频（小文件）上的问题，因为你可以看到文本显示ok，但一旦你折叠它，它就不会再次打开。检查这个，我已经做了一个错误的硬编码修复，这是可以作为临时解决方案，但在生产。。。不，不，不！整个扩展逻辑是错误的。。。例如，如果您崩溃并使用myFunc进行动态更新，它将失败，这里有很多逻辑问题，最好从头重写。