javascript中最大字符数的链接不起作用

link for max characters in javascript not working

本文关键字:链接 不起作用 字符 javascript      更新时间:2023-09-26

我有一个js,运行它可以查看是否达到了最大字符数。它有文本和href,但当达到最大字符数时,链接不起作用,并将其转换为文本。当限制小于580个字符时,链接有效。当它达到极限时,"阅读更多"链接确实有效。任何建议或帮助,请并感谢

$(document).ready(function () {
var stylistText = $('#stylistText');
var stylistText2 = document.getElementById("stylistText").innerHTML;
var countActualText = stylistText2.valueOf().length;
var maxLength = 580;
var aElement = document.createElement('a');
var linkText = document.createTextNode(" ...Read more");
aElement.appendChild(linkText);
aElement.href = "#";
if (countActualText > maxLength) {
    stylistText.text(stylistText.text().substring(0, 580));       
    stylistText.append(aElement);
   }
});

这是html

    <div class="stylistInfo">        
        <img id="stylistPhoto" src="images/Test.jpg" alt="peekaboo beans stylist" />
        <p id="stylistText">
            <a href="sdf">This is supposed to be a link</a> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec mauris odio. Sed varius, felis eget rutrum scelerisque, enim ligula porta nulla, id rhoncus orci nisi at nunc. Fusce cursus, libero a sagittis viverra, arcu eros luctus arcu, sit amet euismod sapien purus quis nisl. Praesent aliquam aliquam ante ornare pulvinar. Mauris ultrices dictum quam, at ornare dui blandit id. Sed erat elit, fringilla quis diam at, euismod rhoncus massa. Curabitur at arcu nisl. Nullam tincidunt lacus sapien, sed porttitor odio sodales sit amet. Nunc tincidunt nisi et nulla aliquam cras amet.Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis nec mauris odio. Sed varius, felis eget rutrum scelerisque, enim ligula porta nulla, id rhoncus orci nisi at nunc. Fusce cursus, libero a sagittis viverra, arcu eros luctus arcu, sit amet euismod sapien purus quis nisl. Praesent aliquam aliquam ante ornare pulvinar. Mauris ultrices dictum quam, at ornare dui blandit id. Sed erat elit, fringilla quis diam at, euismod rhoncus massa. Curabitur at arcu nisl. Nullam tincidunt lacus sapien, sed porttitor odio sodales sit amet. Nunc tincidunt nisi et nulla aliquam cras amet.
        </p>
    </div>

更改stylistText.text(stylistText.text().substring(0, 580));stylistText.html(stylistText.html().substring(0, 580));

但是,截断包含HTML的文本块可能会导致其他问题,尤其是如果截断发生在元素的中间。我建议你重新思考一下这方面的整个策略。