Availability

JavaScript 1.0; enhanced in JavaScript 1.1

Inherits from/Overrides

Inherits from Input, HTMLElement

Synopsis

form.button_name 
form.elements[i]

Properties

Button inherits properties from Input and HTMLElement and defines or overrides the following:

value

A string property that specifies the text that appears in the button. The value of this property is specified by the value attribute of the HTML <input> tag that creates the button. In browsers that cannot reflow document content, this property may be read-only.

Methods

Button inherits methods from Input and HTMLElement.

Event Handlers

Button inherits event handlers from Input and HTMLElement and defines or overrides the following:

onclick

Invoked when the button is clicked.

HTML Syntax

A Button element is created with a standard HTML <input> tag:

<form>
    ...
  <input
    type="button"          // Specifies that this is a button
    value="label"          // The text that is to appear within the button
                           // Specifies the value property
    [ name="name" ]        // A name you can use later to refer to the button
                           // Specifies the name property
    [ onclick="handler" ]  // JavaScript statements to be executed when the button
                           // is clicked
  >
    ...
</form>

Button objects can also be created with the HTML 4 <button> tag:

<button id="name"
        onclick="handler">
label
</button>

Description

The Button element represents a graphical push button in a form within an HTML document. The value property contains the text displayed by the button. The name property is the name the button may be referred to as. The onclick event handler is invoked when the user clicks on the button.

Usage

Use a Button element whenever you want to allow the user to trigger some action on your web page. You can sometimes use a Link object for the same purpose, but unless the desired action is to follow a hypertext link, a Button is a better choice than a Link, because it makes it more explicit to the user that there is something to be triggered.

Note that the Submit and Reset elements are types of Buttons that submit a form and reset a form's values. Often these default actions are sufficient for a form, and you do not need to create any other types of buttons.

Example

<form name="form1">
    <input type="button"
        name="press_me_button"
        value="Press Me"
        onclick="username = prompt('What is your name?',")"
    >
</form>

See Also

Form, HTMLElement, Input, Reset, Submit; HTMLInputElement in the DOM reference section