用链接替换主题标签,它仅替换字符串中的最后一个单词

时间:2019-03-23 11:26:29

标签: javascript jquery

我正试图制作一个标签系统,所以我达到了编辑文本功能,如果用户键入标签词,我想用标签链接替换输入的编辑。因此,我正在使用JavaScript和jQuery来执行此操作,但问题是for循环仅替换字符串中的最后一个单词,而不是用链接替换所有字符串。

// Turn hashtags into links
var discussionText = "#example #text #string #one #two #three #hashtag #word";
var wordsArray = discussionText.split(" ");

for (i = 0; i < wordsArray.length; i++) {
  console.log(i);
  if (wordsArray[i].indexOf('#') > -1) {
    var wordWithoutHashtag = wordsArray[i].replace("#", "");
    console.log(wordWithoutHashtag);
    $("#" + editDiscussionButtonId + "-" + editDiscussionButtonUserId + "-spanDiscussionEdit").html(function() {
      return $(this).text().replace(wordsArray[i], "<a href='search.php?sec=all&q=" + wordWithoutHashtag + "' class='hashtag_link'>" + wordsArray[i] + "</a>");
    });
  }
}

2 个答案:

答案 0 :(得分:1)

更改html(function)以使用现有的html参数。当您使用text()时,它不会返回在循环的先前迭代中创建的先前的<a>,仅返回<a>中的文本。

$(selector).html(function(index, existingHtml){
   return existingHtml.replace(wordsArray[i], ....
});

类似地,如果您只是将$(this).text().replace..更改为$(this).html().replace...,则可以使用。


一种更有效的方法是在循环之前获取现有内容一次,并对存储在变量中的字符串进行所有修改,然后在循环完成后替换修改后的内容一次

答案 1 :(得分:1)

发布此问题后,我将继续尝试解决方案,直到提出以下内容,该内容适用于所有案例标签

var discussionText = "#example #text #string #one #two #three #hashtag #word";
var wordsArray = discussionText.split(" ");
                    var fullText = "";

                    for(i=0; i < wordsArray.length; i++) {

                        if (wordsArray[i].indexOf('#') > -1) {
                            var wordWithoutHashtag = wordsArray[i].replace("#", "");

                            var wordLink = wordsArray[i].replace(wordsArray[i], "<a href='search.php?sec=all&q="+wordWithoutHashtag+"' class='hashtag_link'>"+wordsArray[i]+"</a>");
                            fullText += " " + wordLink;
                            $("#"+editDiscussionButtonId+"-"+editDiscussionButtonUserId+"-spanDiscussionEdit").html(fullText);
                        } else {
                            fullText += " "+wordsArray[i];
                        }

                    }