CODEWITHSUNDEEP
jquery
jonasll
jonasll

Reputation: 493

Start Function if input length > 3 characters

Part 1: I want the .highlight() function to be active only when the input length is larger than 3. After 3 characters, I want every keystroke to look for this value and apply the .highlight() function (which works fine when using a static value). I am using it as a find in page function.

So here's what I have tried, but without success:

<script type="text/javascript">

$(document).ready(function() {
  if($("#search_doc_input").length > 3) {
    $('#search_doc_input').keydown(function() {
      $(body).highlight($(this).val()); 
    });
  }
});

</script>

Part 2: Also, what would be the best way, once the highlight function is active for a certain value, to scroll to the first instance of the new <span class="highlight"> added (which is what the .highlight() function does)?

Upvotes: 0

Views: 16239

Answers (4)

biziclop
biziclop

Reputation: 14596

Fiddle example:

http://jsfiddle.net/uZVGb/1/

Updated:

http://jsfiddle.net/8aM2d/1/

Upvotes: 5

Leo
Leo

Reputation: 5286

if($("#search_doc_input").length > 3) will actually check if there is more than 3 dom elements that match your selector, wich is an id, so that should never happen.

You probably want to look at the length of the value that's in the input, like this :

if($("#search_doc_input").val().length > 3)

Upvotes: 4

SLaks
SLaks

Reputation: 887453

You need to put your all logic in the keyup event handler.

To also check on page load, call keyup() after adding the handler to run it immediately.

Upvotes: 0

parapura rajkumar
parapura rajkumar

Reputation: 24403

I think your problem is the length check should be done within keydown before calling highlight.

The way you have it currently keydown won't be hooked up if length is less than 3. Which is probably true when you load the page

Upvotes: 1

Related Questions