如何使多个“更多阅读”按钮分开工作

时间:2019-08-27 09:20:42

标签: javascript php html

我有一个带有更多阅读按钮的新闻源,但是每次我点击阅读更多按钮时,它只会打开上部帖子的隐藏文本(添加的最后一个)。我需要一个解决方案,将每个“更多阅读”按钮与其相应的帖子关联起来

PS:我有成千上万的帖子可供显示和阅读,摘自数据库

这是我的示例代码

<?php

$string = $body;
        if (strlen($string) > 300) {

            $stringCut = substr($string, 0, 300);
            $stringRest= substr($string, 300);

        $string = $stringCut;       

            $string .= '<style>
#more {display: none;}
</style><span id="dots">...</span><span id="more">'.$stringRest.'</span> 

<button onclick="myFunction()" id="myBtn">Read more</button>
';
?>

<?php echo $string ?>



<script>
function myFunction() {
var dots = document.getElementById("dots");
var moreText = document.getElementById("more");
var btnText = document.getElementById("myBtn");

if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "Read more"; 
moreText.style.display = "none";
} else {
dots.style.display = "none";
btnText.innerHTML =`enter code here` "Read less"; 
moreText.style.display = "inline";
}
}
</script>

0 个答案:

没有答案