您现在的位置:首页 >> 前端 >> 内容

HTML下普通按钮实例讲解

时间:2018/4/17 11:49:20 点击:

  核心提示:普通按钮把 input 元素的 type 属性设置为button,可以创建普通按钮。按钮上显示的文本是value 属性的值,如果没有提供 value 属性,则只创建一个空按钮。如:input type...

普通按钮

把 input 元素的 type 属性设置为“button”,可以创建普通按钮。按钮上显示的文本是value 属性的值,如果没有提供 value 属性,则只创建一个空按钮。如:

<input type="button" value="立即购买">

上述按钮的运行结果如图 3‑33 所示:

HTML下普通按钮实例讲解

图3-33 普通按钮

默认情况下,在普通按钮上点击,是没有任何反应的。因此,需要为普通按钮注册事件,并手动编写相应的处理函数。假如希望单击上述按钮时,提交表单,则要为按钮注册onClick 事件。如:

<form name="buy" action="form.html" method="post">

    <button onClick="submitForm(buy)">立即购买</button>

</form>

现在点击按钮,就会触发 onClick 事件,并调用事件处理函数submitForm(buy),参数 buy 为待处理表单name 属性的值。如果希望点击按钮后提交表单,就可以在事件处理函数中调用 form 对象的 submit() 方法:

function submitForm(f) {

    f.submit();  

}

Tags:HT TM ML L下 
作者:网络 来源:歪脖先生的博客