JSFiddle - React, Tailwind, and code Playground

by jasonwilczak

HTML

<div id="value">
	<a href="#">hello</a>
</div>
<div id="edit">
	<input type="text" value="hello" />
</div>

JavaScript

$(function() {	
    var valueClickedFromEnter = false;
    $('#edit').hide();
	function handleLinkClick(event)
    {
             $('#edit').show();
			$('#edit input').focus();
			$('#value').hide();
            valueClickedFromEnter = 
                (event.keyCode && event.keyCode == 13);   
    }
	$('#value')
		.css('cursor', 'pointer')
		.keydown(handleLinkClick).click(handleLinkClick);
	
	$('#edit input')
		.keyup(function(e) {            
			if (e.keyCode == 13 && !valueClickedFromEnter) {  // <enter>
				$('#value').show();
				$('#edit').hide();
			}
            valueClickedFromEnter = false;
		});
  });