0

Can someone help me with lowercase and uppercase? If I typing in input "long" I have only "long" in results, but I want have in results both "long" and "Long", else if I typing "Long" I want have in results both "Long" and "long".

There is my code:

html

<input id="search" type="text" placeholder="Search" />
<div class="post">Long long</div>

jQuery

$('#search').on('keyup', function(event) {
  var keyword = event.currentTarget.value;
  highlight('.post', keyword);
});

function highlight(selector, keyword) {
  $(selector).each(function(index, element) {
    var $element = $(element);
    var original = $element.data('originalText');
    if (original == undefined) {
      original = $element.html();
      $element.data('originalText', original);
    }
    $element.html(original.replace(keyword, '<span class="highlight">' + keyword + '</span>'));
  });
}

css

.highlight {
  background: yellow;
}

and link to fiddle https://jsfiddle.net/txow4Lps/

esovetnik
  • 1
  • 2
  • 1) `.replace(text, newtext)` will only replace the first - use `.replaceAll` or a `regex`. 2) use a regex with `gi` options: jsfiddle.net/Ljo24b0a – freedomn-m Dec 07 '21 at 09:09
  • Does this answer your question: [how to use a variable with a regular expression](https://stackoverflow.com/questions/494035/how-do-you-use-a-variable-in-a-regular-expression) (with options `gi` for case insensitive) – freedomn-m Dec 07 '21 at 09:10
  • You can compare whole text and part you wanna highlight in same case. For example transform both text and part to lower case during search. – Xeelley Dec 07 '21 at 09:17
  • when typing the text and in the search result it does not matter if I write with a small letter or with a capital letter – esovetnik Dec 07 '21 at 09:20
  • Mby some function like L=l – esovetnik Dec 07 '21 at 09:25
  • https://jsfiddle.net/j75fmckz/ – freedomn-m Dec 07 '21 at 09:58
  • Man, you have level "GOD" ))) Send me your adress, I'll send your beer! – esovetnik Dec 07 '21 at 10:31

0 Answers0