Home/ Questions/Q 7536003
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-30T06:27:20+00:00

Can anyone tell me why I keep getting a displaymessage is not defined error

  • 0

Can anyone tell me why I keep getting a “displaymessage is not defined” error message with this code.. Thanks in advance 🙂

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>TEST PAGE</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function() {

function displaymessage() {
    alert("Hello World!");
    }

});
</script>
</head>

<body>
<p><input type="button" name="start" id="start" value="start" onclick="displaymessage()" /></p>
</body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You define your displayMessage function in a DOM Ready callback – which means that it will be defined when …well… the DOM is ready. And yet – you add it as a handler to a click of a DOM element – something that will be processed before the function is actually defined.

    Move the definition out of $(document).ready(function(){...} and you’ll be OK.

    Additionally, the preferred way of binding handlers to various DOM events is programmatic, rather than declarative. Instead of adding an onclick attribute to your button you should rewrite the entire thing to something like:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

...

<script type="text/javascript">
$(document).ready(function() {

function displaymessage() {
    alert("Hello World!");
}

$('#start').on('click', displaymessage);

});
</script>
</head>

<body>
<p><input type="button" name="start" id="start" value="start"/></p>
</body>
</html>
    • 0