I am calling a function on a button click. But the function is not getting called. I dont know what I am doing wrong. Please help.
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function clear() {
document.getElementById('inp').value = "";
}
</script>
</head>
<body>
<input type="text" id="inp" name="">
<input type="button" onclick="clear()">
</body>
</html>clear is not a reserved word but its calling document.clear instead. Try updating name of function
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function clear1() {
document.getElementById('inp').value = "";
}
</script>
</head>
<body>
<input type="text" id="inp" name="">
<input type="button" onclick="clear1()">
</body>
</html>Note: its a bad practice to override document/window/prototype functions. This is just for demonstration purpose.
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function clear1() {
document.getElementById('inp').value = "";
}
document.clear = function(){
console.log('My clear function')
}
</script>
</head>
<body>
<input type="text" id="inp" name="">
<input type="button" onclick="clear()">
</body>
</html>Change the function name because clear function make that issue. make the function name clearInput or what ever you convenient
<!DOCTYPE html>
<html>
<head>
<title></title>
<script type="text/javascript">
function clearTxtBox() {
document.getElementById('inp').value = "";
}
</script>
</head>
<body>
<input type="text" id="inp" name="">
<input type="button" onclick="clearTxtBox()">
</body>
</html>
Just change your function name and it will work.
document.clearinstead. I have shared a reference link in my answer. You can check it