JSFiddle - React, Tailwind, and code Playground

by Joe Pool

HTML

<table>
  <tr><td>Message:</td><td>&nbsp;</td></tr>
  <tr>
    <td>&nbsp;</td>
    <td style="text-align:left;">
      <textarea rows="6" cols="30" onfocus="jsFocus1(this.id)" onblur="jsBlur1(this.id)">[Write your message here or call my voice number at (555) 222-1234.]</textarea>
    </td>
  </tr>
  <tr>
    <td>Test1:</td>
      <td><input type="text" id="txtFirst" onfocus="if(this.value=="First Name"){this.value=''};" value="First Name" /></td>
  </tr>
  <tr>
    <td>Test2:</td>
      <td><input type="text" id="txtLast" onfocus="if(this.value=="Last Name"){this.value=''};" value="Last Name" /></td>
  </tr>
</table>

JavaScript

var contactPrompt = '[Write your message here or call my voice number at (555) 222-1234.]';
function jsFocus1(txtID) {
  var textBox = document.getElementById(txtID);
  if (textBox.value == contactPrompt) {
    textBox.value = '';
  }
}
function jsBlur1(txtID) {
  var textBox = document.getElementById(txtID);
  if (textBox.value == '') {
    textBox.value = contactPrompt;
  }
}