JS Подсветка текстовых строк

Использование небольшого плагина для выделения текстовых строк из поля ввода в форме.

JQuery плагин для выделения текста на JavaScript

Я немного изменил код, чтобы пользователь мог добавить несколько стримов в поле ввода, разделив их запятой, которая выделит несколько ключевых слов.

Это прекрасно работает в этом случае: стек, переполнение, JS

Однако, если бы я набрал в стеке, переполнении, JS, (обратите внимание, после последней строки), он зависает браузер и перестает отвечать на запросы.

Код, который я использую:

$(function() { 
    if ( $("input#searchterm").val().length > 0 ) {
        $("input#searchterm").addClass('marked-purple');
        var arrayOfKeyWords= $("input#searchterm").val().split(',');
        for (var i=0;i<arrayOfKeyWords.length;i++) {
            $('.message p.messagecontent').highlight(arrayOfKeyWords[i]);
        }
    }           
});

У кого-нибудь есть идеи, как игнорировать последнюю запятую, если пользователь ее добавил?

заранее спасибо

2 ответа

Решение

Вы можете сделать проверку пустого значения перед вызовом highlight(), как это:

if ($("#searchterm").val().length > 0) {
    $("#searchterm").addClass('marked-purple');
    var arrayOfKeyWords = $("#searchterm").val().split(',');
    for (var i = 0; i < arrayOfKeyWords.length; i++) {
        if (arrayOfKeyWords[i] !== "") { // ensure there is a value to highlight
            $('.message p.messagecontent').highlight(arrayOfKeyWords[i]);
        }
    }
}

В качестве альтернативы вы можете удалить запятые, если они есть.

if ($("#searchterm").val().length > 0) {
    $("#searchterm").addClass('marked-purple');
    var arrayOfKeyWords = $("#searchterm").val().replace(/,+$/, '').split(',');
    for (var i = 0; i < arrayOfKeyWords.length; i++) {
        $('.message p.messagecontent').highlight(arrayOfKeyWords[i]);
    }
}

Вот как вы можете удалить последнюю запятую строки:

var str = "stack,overflow,js,"; 
if(str.charAt( str.length-1 ) == ",") {
  str = str.slice(0, -1);
}
Другие вопросы по тегам