阅读更多阅读更少的文本Smarty3中的截断和子字符串问题

Question

标题

我正试图使用javascript在smarty模板中实现"多读"one_answers"少读"选项，但我在输出文本时遇到了以下问题，当我单击"多读取"按钮时，一些字符丢失了。Truncate和substr函数似乎有问题，并且它对于表中的每一行都不是常量。

$Test的最大大小->描述是200个字符，它有不同的文本长度，大约120、150、200等

我正在尝试使用截断函数显示前100个字符

{$Test->description|truncate:100:"}

，然后在单击"阅读更多"按钮后，使用substr函数将剩余字符从101到200。

这种逻辑似乎只适用于少数行，而不是所有行。

有人能建议解决这个问题吗？

test.tpl文件：

｛foreach…｝｛$Test->description|truncate:100:"｝｛$Test->description|substr:101:200｝阅读更多
｛文字｝#more｛/literal｝｛$smarty.foreach.count.index｝{literal}｛display:none；｝.button｛/literal｝｛$smarty.foreach.count.index｝{背景颜色：白色；颜色：黑色；边框：1px实心#e7e7e7；宽度：自动；字体大小：10px；}.button｛/literal｝｛$smarty.foreach.count.index｝{literal｝：悬停{背景颜色：#e7e7e7；宽度：自动；字体大小：10px；}｛/literal｝
<script language="JavaScript" type="text/javascript">
{literal}
function myFunction{/literal}{$smarty.foreach.count.index}{literal}() {
var dots = document.getElementById("dots{/literal}{$smarty.foreach.count.index}{literal}");
var moreText = document.getElementById("more{/literal}{$smarty.foreach.count.index}{literal}");
var btnText = document.getElementById("myBtn{/literal}{$smarty.foreach.count.index}{literal}");
if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "Read more";
moreText.style.display = "none";
} else {
dots.style.display = "none";
btnText.innerHTML = "Read less";
moreText.style.display = "inline";
}
}
{/literal}
</script>
</td>
</tr>
{/foreach}

Answer 1

我想我找到了答案

｛$Test->描述|截断：100:"：TRUE｝｛$Test->描述|子字符串：100:200｝