JSFiddle - React, Tailwind, and code Playground

by master1991

HTML

<div class="calculatorWrapper">

	
	<div class="formField"> 
		<span id="fromSpan">&nbsp;Hrs:</span> 
		<input type="text" id="ValTimeField" placeholder=" Insert time" size="15">
	</div>
	

	
	<div class="formField"> 
		<span id="toSpan">Sec:</span> 
		<input type="text" placeholder="The result is..." id="resultInput">
    <span id="toSpan">Nez:</span>
    <input type="text" placeholder="The result is..." id="resultInput2">
    <span id="toSpan">Min:</span>
    <input type="text" placeholder="The result is..." id="resultInput3">
	</div>
</div>

JavaScript

var conversionType;
	function convertUnitTime(){
		var ValTime=$('#ValTimeField').val();
		if(conversionType==='hoursToseconds'){
    	$('#resultInput').val(((parseFloat(ValTime)*3600).toFixed(10)*1/1));
      $('#resultInput2').val(((parseFloat(ValTime)/3600).toFixed(10)*1/1));//
      $('#resultInput3').val(((parseFloat(ValTime)*60).toFixed(10)*1/1));
			return;
		}

	}

	conversionType='hoursToseconds';
	$('#ValTimeField').on('keyup blur',convertUnitTime);