Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 10 of 10

Thread: Alert Box

  1. #1
    New Coder
    Join Date
    Jun 2014
    Location
    Hastings, UK
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Alert Box

    Please how do I insert an alert box here

    Code:
    <head>
    <br><br><br><br><center>
    <font face="arial" size="4" color="FF0000"><b>
    MOUSE TRAINER  -- Click on one of the images <p><p><p><p>
    <script type="text/javascript">
    function onmousedown()
    {
    document.getElementById("b1").src = "b_blue.gif";
    }
    
    function show_alert()
    {
    alert("Well done");
    }
    </script> </head>
    
    <body>
    
    <a show alert_alert() />
    <img border="0" src="smile.gif" 
      id="b1"
    width="26" height="26" onmousedown="onmouseDown()" /n>
    
    </body>
    
    </center></html>

  • #2
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,686
    Thanks
    25
    Thanked 656 Times in 655 Posts
    First lets get you into the twenty-first century:
    Code:
    <!DOCTYPE html>
    <html>
    <head>
    <title>Title of the document</title>
    <style type="text/css">
    body{
    	font-family: Arial, Verdana, Helvetica, sans-serif;
    	font-size: small;
    	color: #ff0000;
    	width: 1060px;
    }
    img{
    	border: 1px solid black;
    }
    div{
    	width: 270px;
    	margin: 0 auto;
    	text-align:center;
    }
    </style>
    </head>
    
    <body>
    <div>
    	mouse trainer  -- click on one of the images<br>
    	<img src="smile.gif" id="b1" width="26" height="26" onmousedown="onmouseDown();">
    </div>
    
    <script type="text/javascript">
    function onmouseDown(){
    	document.getElementById("b1").src = "b_blue.gif";
    }
    function show_alert(){
    	  alert("well done");
    }
    </script>
    </body>
    </html>
    Notice the doctype, JS after the page code. I removed the anchor opening tag.

    Now the question: How to make the alert("well done"); happen? Two ways. You could add it to the function the mousedown calls by changing it to:
    Code:
    function onmouseDown(){
    	document.getElementById("b1").src = "images/2dig2du.gif";
    	alert("well done");
    }
    Or you could do a double call (but this is not recommended in this case)

    This change:
    Code:
    <img src="images/submit.gif" id="b1" width="26" height="26" onmousedown="onmouseDown(); show_alert();">
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."

  • #3
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by sunfighter View Post
    First lets get you into the twenty-first century:
    alert for live use became obsolete early in the 21st Century and it was repurposed for debugging. Some browsers add extra checkboxes to assist in debugging.

    Now that all browsers have built in debugging tools the use of alert is now completely obsolete and some people turn it off completely so as to not see debugging alerts someone accidentally left in their script.

    A 21st century alternative is to use innerHTML or DOM calls to display your own "alert" box directly in the web page itself.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #4
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,686
    Thanks
    25
    Thanked 656 Times in 655 Posts
    Really.
    alert is now completely obsolete
    Bunk. Nowhere in the specs does it say that your gonna lose your two typing fingers if you TS with alerts. I use em all the time and the javascript Nazis haven't knock on my door once and after they read this they still wont come around I betcha. I hate the console and use it sparingly, but I cut and paste alert('Here');die; More times then I lift a cup of coffee to my console hating face. I also run with scissors in my hand and don't throw split salt over my shoulder.
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."

  • #5
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    Quote Originally Posted by sunfighter View Post
    Really. Bunk. Nowhere in the specs does it say that your gonna lose your two typing fingers if you TS with alerts. I use em all the time
    I agree - I used to just check the "Disable JavaScript for this page" checkbox whenever an alert appeared on the basis that anyone who forgot to remove the debugging code before the script went live probably hadn't finished testing it properly. Now I just have my browser redirect all alert messages to the console so that I don't see the debugging messages at all.

    I hate being interrupted by modal dialogs and there is nothing says that you have to allow debugging alert calls to display in your browser any more. Since everyone gets to choose whether they see the debugging calls or not there is no reason for the JavaScript Nazis to care whether people still debug that way or not.
    Last edited by felgall; 06-28-2014 at 05:45 AM.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #6
    New Coder
    Join Date
    Jun 2014
    Location
    Hastings, UK
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks for all you help and advice folks. As you can guess I am strictly a largely self taught Amateur at any programming such as relying on HTML and Javascript / Ajax books sold by W3schools. You might like to browse around my perfectly safe site protected by AVG at Gordon Sweet's Hastings Amateur Radio and Freeware . Many of the pages are my HTML apart from script kindly provided by a friend in the Radio club and for the free counters. Some pages being repetitive like for Daily pages are produced by Basic code.

    Feel free to offer advice with suggestions, meanwhile I will study above intended to help complete beginners to a PC use the Mouse as an alternative to the Freeware versions on my site.

  • #7
    Master Coder felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, Australia
    Posts
    6,642
    Thanks
    0
    Thanked 649 Times in 639 Posts
    W3Schools isn't the best of sites to learn from. Most of the topics are significantly out of date as the two guys who created the site don't have enough time to keep so many different topics up to date.
    Stephen
    Learn Modern JavaScript - http://javascriptexample.net/
    Helping others to solve their computer problem at http://www.felgall.com/

    Don't forget to start your JavaScript code with "use strict"; which makes it easier to find errors in your code.

  • #8
    New Coder
    Join Date
    Jun 2014
    Location
    Hastings, UK
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Forgive my extreme ignorance but now you have changed to a totally different style how to I smarten up the display by using below.

    Code:
    <br><br><br><br><br>
    <body bgcolor="FFFFCC">
    <font face="arial" size="10" color="FF0000"><b>

  • #9
    New Coder
    Join Date
    Jun 2014
    Location
    Hastings, UK
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    I would welcome suggestions on any alternative to books instead by W3schools. Unlike modern Kindles I am a book lover ideal for reading when the wretched adverts keep coming up on TV.

    I have most of the books on various version of Windows !!

  • #10
    New Coder
    Join Date
    Jun 2014
    Location
    Hastings, UK
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Here is my version in my ancient crude way

    Code:
    <html>
    <head>
    <br><br><br><br><center>
    <body bgcolor="33FF66">
    <font face="arial" size="4" color="FF0000"><b>
    MOUSE TRAINER  -- Click on one of the images
    
    <body>
    <div>
    	<br><br>
    	<img src="smile.gif" id="b1" width="26" height="26" onmousedown="onmouseDown();">
    	<br><br>
    	<img src="smile.gif" id="b1" width="16" height="16" onmousedown="onmouseDown();">
    	<br><br>
    	<img src="smile.gif" id="b1" width="9" height="9" onmousedown="onmouseDown();">
    	<br><br>
    	<img src="smile.gif" id="b1" width="5" height="5" onmousedown="onmouseDown();">
    </div>
    
    <script type="text/javascript">
    function onmouseDown(){
    	document.getElementById("b1").src = "smile.gif";
    	alert("well done");
    }
    function show_alert(){
    	  alert("well done");
    }
    </script>
    </body>
    
    </center></html>


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •