Блог

Главная - Вопросы по программированию - Замена хэштега ссылками, он заменяет только последнее слово в строке

Замена хэштега ссылками, он заменяет только последнее слово в строке

#javascript #jquery

#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=allamp;q="   wordWithoutHashtag   "' class='hashtag_link'>"   wordsArray[i]   "</a>");
    });
  }
}

Ответ №1:

Измените html(function) , чтобы использовать существующий аргумент html. При использовании text() он не возвращает предыдущий, <a> созданный вами на предыдущих итерациях цикла, только текст внутри <a> .

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

Аналогично, если бы вы просто изменили $(this).text().replace.. на $(this).html().replace... , это сработало бы.

Более эффективным подходом было бы получить существующий контент один раз перед циклом и внести все изменения в строку, хранящуюся в переменной, затем заменить измененный контент один раз после завершения цикла

Комментарии:

1. спасибо за ваш ответ ну, я попробовал это, это работает, но это не работает, например, для #face и # facebook, потому что это заменит #facebook ссылкой на #face итак, я пытался придумать решение, и я сделал то, которое отлично работает после публикации этого вопроса, я думал таким же образом, что и решение, которое я опубликую

Ответ №2:

После того, как я опубликовал этот вопрос, я продолжаю пробовать решения, пока не придумал приведенный ниже, который идеально работает для тегов всех случаев

 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=allamp;q=" wordWithoutHashtag "' class='hashtag_link'>" wordsArray[i] "</a>");
                            fullText  = " "   wordLink;
                            $("#" editDiscussionButtonId "-" editDiscussionButtonUserId "-spanDiscussionEdit").html(fullText);
                        } else {
                            fullText  = " " wordsArray[i];
                        }

                    }