JSFiddle - React, Tailwind, and code Playground

by huuzoo

HTML

<input type="text" id="form" onchange="checkValue()">
<div>入力内容：<span id="opt_value"></span></div>
<p id="less">5文字以上入力してください。</p>

CSS

#less {
  display: none;
}

JavaScript

function checkValue() {
	var ipt_form = document.getElementById('form');
  var ipt_value = ipt_form.value;
  document.getElementById('opt_value').innerHTML = ipt_value;
  
  if( ipt_value.length < 5 ) {
  	document.getElementById('less').style.display = 'block';
    ipt_form.value = '';
  } else {
   	document.getElementById('less').style.display = 'none';
  }
}