JSFiddle - React, Tailwind, and code Playground

by vrluckyin India

HTML

<!-- ajax search box with delay and min len --> 
<label for="input">Type something</label>
<input id="input" name="vorname" type="text" size="30" maxlength="30">
<div id="output"></div>

JavaScript

$.fn.ajaxSearchBox = function (callback, delay, minlen) {
        var timer = 0;
        var el = $(this);
        $(this).keyup(function () {
            clearTimeout(timer);
            timer = setTimeout(function () {
                var val = $(el).val();
                if (val.length >= minlen) {
                    callback(el);
                }
            }, delay);
        });
        return $(this);
    };

var buffer = []
$('#input').ajaxSearchBox(function(el){
         //buffer.push('<br/> ' +el.val());
         $('#output').append('<br/> ' +el.val());
},300,4);