JSFiddle - React, Tailwind, and code Playground

by kanonji

HTML

<form>
    <input id="input" type="text" name="input" value="">
    <input id="repeater" type="text" name="repeater" value="">
    <input id="hiragana" type="text" name="hiragana" value="">
</form>

JavaScript

$(function(){
    var $input = $('#input');
    var $repeater = $('#repeater');
    var $hiragana = $('#hiragana');
    $input.keydown(function(e){
        var stash = $input.val();
        var len = stash.length;
        console.log('keydown', stash);
        onInput($input, function(value){
            console.log('onInput', value);
        });
        
    });
});

function onInput($elem, callback){
    var before = $elem.val();
    console.log('before',before);
    var intervalId = setInterval(watcher, 10)
    function watcher(){
        var after = $elem.val();
        console.log('after',after);
        if(before !== after) {
            clearInterval(intervalId);
            callback(after);
        }
    }
}

function extract($input){
    var val = $input.val();
    var code = val.charCodeAt(val.length-1);
    //console.log(code);
    if(12353 <= code && code <= 12436){
        return val[val.length-1];
    }
    return '';
}

function isAlphabeat(char){
    if(
        (97 <= char && char <= 122) ||
        (65345 <= char && char <= 65370)
    ) return true;
    return false;
}