How to create a text box with some placeholder which disappears on click?

[sariga.vr@bdb.ai]

 <style>input:focus {outline:none;}::placeholder {color: #6a6b70;}</style><input id="Target_filter_search01" autocomplete="off" placeholder="Enter the text that should be printed as placeholder here....." style = "width: 100%; height : 100%; padding :0px 0px 0px 10px; color : #6a6b70; border : 0px; border-radius: 4px; background : #f2f0f0;"/> <style> input:focus { outline:none; } </style> <script> //debugger; var inp = document.getElementById("Target_filter_search01"); inp.addEventListener("keyup", function(event) { if (event.keyCode === 13) { //alert('l'); var a = $('#Target_filter_search01').val(); </script>

          Using this code we can create a textbox with placeholder.