Clearing a text field using javascript

Question

<script>
function clear() {
    document.getElementById('box').value = " ";
    };
</script>

<input type="text" id="box" onFocus="clear()" value="Type name here">

Hi, so i'm fairly new to javascript and I'm trying to clear a text field onFocus. I have searched the site and found other ways to do this, but i was curious as to why this code wouldn't work. Would appreciate any help, thanks :)

That was it, thank you! cannot use clear(), typed in something else and its working fine — Andy Smith, Jun 02 '16 at 13:09

epascarello · Accepted Answer · 2016-06-02T13:09:30.817

2

Modern day browsers have it built it in. It is the placeholder attribute. No JavaScript is needed.

<input type="text" id="box" placeholder="Type name here">

Reason your code did not run was a name collision with document.clear which is deprecated, if you change the name it works fine.

function xclear() { 
    document.getElementById('box').value = " ";
};

<input type="text" id="box" onFocus="xclear()" value="Type name here">

edited Jun 02 '16 at 13:09

answered Jun 02 '16 at 13:04

epascarello

204,599
20
195
236

Thanks yes that is a solution to the problem, but i was really trying to understand why the code wouldn't work. the input has a 'value', and the javascript should change that value but it doesn't.. – Andy Smith Jun 02 '16 at 13:07

Clearing a text field using javascript

1 Answers1