JSFiddle - React, Tailwind, and code Playground

by master1991

HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<input style="width:45%; float:left; margin-right:10%;" type="text" class="cEx" placeholder="YYYY-MM" />

JavaScript

/*$(document).ready(function(){
    $(".cEx").keydown(function(){
    
          this.value=this.value.split("/").slice(0,2).map((el,i)=>parseInt(el,10)&&i<2?el.slice(0,2+2*i):"").join("/");
    });
});*/


$(document).on('keyup','.cEx', function(e){


    var count = $(this).val().length;
    //alert(count);
    
    if(count == 4 && e.keyCode != 8){
      $(this).focus().val(function( index, value ) { 
      	return value + "-" ;
      });
    }
    if(count >7){
    	result = $(this).val().slice(0, 7);
      $(this).val(result);
    }
    
    console.log(count);
});





/*window.addEventListener("load",function(){
 document.getElementByClassName("cEx").addEventListener("input",function(){
   this.value=this.value.split("/").map((el,i)=>parseInt(el,10)&&i<2?el.slice(0,2):"").join("/");
  });
});*/