JSFiddle - React, Tailwind, and code Playground
HTML
<input id="one" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = ''-confirm(1)-'';}"/>
<br/>
<br/>
<input id="two" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = ''-confirm(2)-'';}"/>
<br/>
<br/>
<input id="three" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = ''-confirm(3)-'';}"/>
<br/>
<br/>
<input id="four" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = ''-confirm(4)-'';}"/>
<br/>
<br/>
<input id="five" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = '%27-confirm(5)-%27';}"/>
<br/>
<br/>
<input id="six" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = '\x27-confirm(6)-\x27';}"/>
<br/>
<br/>
<input id="seven" autocomplete="off" type="text" size="40" name="q" value="" onblur="if (this.value == '') {this.value = '\u0027-confirm(7)-\u0027';}"/>