JSFiddle - React, Tailwind, and code Playground

by christopheviau

HTML

<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<input id="input1" />

JavaScript

var wordlist= [ "about", "above", "across", "after", "against",
                "along", "among", "around", "at", "before", 
                "behind", "below", "beneath", "beside", "between", 
                "beyond", "but", "by", "despite", "down", "during", 
                "except", "for", "from", "in", "inside", "into", 
                "like", "near", "of", "off", "on", "onto", "out", 
                "outside", "over", "past", "since", "through", 
                "throughout", "till", "to", "toward", "under", 
                "underneath", "until", "up", "upon", "with", 
                "within", "without"] ; 

$("#input1").autocomplete({
    source: function(req, responseFn) {
        var re = $.ui.autocomplete.escapeRegex(req.term);
        var a = $.grep( wordlist, function(item,index){
            return (re.split('@')[1][0] === item[0]);
        });
        responseFn( a );
    },
    focus: function(){ return false; },
    select: function(a, b){ 
        a.target.value = a.target.value.replace(/(.*@)([^@ ]*)/gi, '$1'+b.item.value);
        return false;
    }
});