JavaScript Tutorial/Form/Button

Материал из Web эксперт
Перейти к: навигация, поиск

Button

The Button object represents a graphical button.

Buttons are created as part of a form by using the <input> tag with the TYPE attribute set to button in an HTML document.

Once created, buttons can be accessed in JavaScript as an element of a form using dot notation.

Arguments, Properties, Methods, and Event Handlers Associated with the Button Object are listed in the following table.

form Returns the form object of a button. name The string specified in the NAME attribute of the HTML <input> tag. type The string specified in the TYPE attribute of the HTML <input> tag. This string is always button for the Button object. value The string that appears in the graphical representation of a button. blur() Removes focus from a button. click() Calls the button"s onClick event handler. focus() Applies focus to a button. handleEvent() Passes an event to the appropriate event handler associated with a button. onBlur The handler invoked when focus is removed from a button. onClick The handler invoked when a button is clicked. onFocus The handler invoked when focus is applied to a button. onMouseDown The handler invoked when the mouse is clicked to select a button. onMouseUp The handler invoked when the mouse is clicked to unselect a button.



<html>
    <h2>The Button NAME Property</h2>
    <form name="myForm">
      <input type="button"
             value="Press here to see the name of this button"
             name="myBigButton"
             onClick="displayButtonName()">
      <input type="text"
             name="textBox">
    </form>
    <script language="JavaScript">
    <!--
    function displayButtonName()
    {
      document.myForm.textBox.value=document.myForm.myBigButton.name;
    }
    -->
    </script>
    </html>


Button.blur()

Syntax



document.form.button.blur()


Button.click()

Syntax



document.form.button.click()


Button.focus()

Syntax



document.form.button.focus()


Button.form

Syntax



document.form.button.form


Button.name

Syntax



document.form.button.name


Button.onBlur

Syntax



onBlur="command"


Button.onClick

Syntax



onClick="command"


Button onclick action event

<html>
<head>
<title>Matching a single literal character</title>
<script type="text/javascript" language="javascript">
<!-- //
function IsMatchingChar(str){
    var myRegExp = /a/;
    return myRegExp.test(str)
}
function TestGuess(){
    var guess = prompt("Enter a lower case character here","a");
    if (IsMatchingChar(guess)){
        alert("The correct answer was " + guess);
    }
    else{
        alert("Sorry " + guess + " doesn"t match");
    }
}
// -->
</script>
</head>
<body>
<form>
<button type="Button" onclick="TestGuess()">Click here to guess</button>
</form>
</body>
</html>


Button.onFocus

Syntax



onFocus="command"


Button.onMouseDown

Syntax



onMouseDown="command"


Button.onMouseUp

Syntax



onMouseUp="command"


Button.type

Syntax



document.form.button.type


Button.value

Syntax



document.form.button.value