Question

我有一个文本块，我想隐藏，直到用户要求查看它。这是我的HTML：

    <a href="javascript:toggleDisplay('01');">
       <div id="title01">
            Show details
       </div>
    </a>
    <div id="hide01" class="details">
        Description:
    </div>

现在，块隐藏和显示效果很好，但是当我更改div title01上的innerHTML时，它不再是一个链接。

这是我的JS：

    var div = document.getElementById('hide'+div_id);
    var title = document.getElementById('title'+div_id);

    if (div.style.display === 'block')
    {
        div.style.display = 'none';
    }
    else
    {
        div.style.display = 'block';    
        title.innerHTML = 'Hide';
    }

由于我仅更改ID为innerHTML的div上的title01，因此我无法理解为什么它不会保留链接。我该怎么做才能解决这个问题？

Answer 1

使用jquery文本函数来更改内容

 $('#title01').text("data to display");

Answer 2

好吧，我通过完全删除<div>并为<a>标记提供了ID来修复它。

所以，我的新HTML看起来像：

<a id = "title01" href="javascript:toggleDisplay('01');">
       Show details
</a>

Answer 3

对于记录，问题是a里面的div。这是非法的，行为将是奇怪的。如果必须在a中包含块级标记，请使用spans set to display：block。

在javascript中更改innerHTML会删除链接

3 个答案: