0

我正在使用 Twitter Bootstrap 的手风琴功能为我的数据库中称为“描述”的某个字段显示或多或少的文本。

我收到 javascript 错误：Uncaught SyntaxError: Unexpected identifier

这是php/html：

<span class="description_text">{{ substr($artist->description,0,100) }}</span>
        <a id="more" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne" style="display:block;">See More...</a>
        <span id="collapseOne" class="accordion-body collapse"><span class="description_text">{{substr($artist->description,101)}}</span></span>
        <a id="less" class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapseOne" style="display:none;">...See Less</a>

这是javascript：

document.getElementById("more").addEventListener('click',function() {

    document.getElementById('less').style.display = "block";  

    document.getElementById('more').style.display = "none";    
}

document.getElementById("less").addEventListener('click',function() {

    document.getElementById('more').style.display = "block";   

    document.getElementById('less').style.display = "none";   
}

我的想法是我希望在单击“查看更多”链接时显示描述字段的其余部分，然后让“查看更多”链接消失并出现“少看”链接。单击少看时，我希望文本消失，然后再次出现“查看更多”链接。

现在，我收到了上面的错误，当文本“展开”时，“少看”按钮没有出现。我正在使用 Laravel 4 对此进行编码。

4

2 回答 2

1

您还没有关闭任何一种.addEventListener方法。

document.getElementById("more").addEventListener('click',function() {

    document.getElementById('less').style.display = "block";  

    document.getElementById('more').style.display = "none";    
}); //here

document.getElementById("less").addEventListener('click',function() {

    document.getElementById('more').style.display = "block";   

    document.getElementById('less').style.display = "none";   
}); //and here
于 2013-09-23T01:36:32.073 回答
1

我发现了这个问题。我需要将事件监听器 javascript 放在页面底部。这使得“Uncaught TypeError: Cannot call method 'addEventListener' of null”错误消失了。希望这可以帮助某人。

于 2013-09-23T04:11:04.990 回答