JavaScript EditorBest javascript editor debugger     Ajax website 

Main Page

Previous Page
Next Page

Creating a Button that Executes a Script

You can associate a button with a script to give your visitor full control over when the script should be executed.

To create a button that executes a script:

Type <button type="button".

Type name="name", where name is the identifier for the button.

Type onclick="script", where script is the code (usually JavaScript) that will run when the visitor clicks the button.

If desired, type style="font: 1.5em Helvetica, Arial, sans-serif; background: yellow; color: red; padding: .3em" (or whatever) to change the appearance of the text on the button.

Type >.

If desired, type the text that should appear on the button.

Type </button>.

Figure 19.10. Notice that the script is the same as the one used in the example in Figure 19.7. The style information here is optional, but it does make the button stand out. I also could have added an image.

Figure 19.11. The button element is more thoroughly explained in Chapter 17, Forms.

Figure 19.12. A click on the button executes the script, as shown here.


  • You can use other intrinsic events with buttons, but onclick makes the most sense.

  • You can also add images to buttons. Simply insert the image between the opening and closing button tags (that is, after step 5 or 6).

  • You can also use buttons with forms (see pages 273 and 275).

Previous Page
Next Page

JavaScript EditorBest javascript editor debugger     Ajax website