HTML宝典(第 1 版)
3.4.3 普通按钮
阅读(

HTML基础

HTML元素

表单及应用

什么是表单

Form元素

表单控件

表单按钮

重置按钮

提交按钮

普通按钮

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

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

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

普通按钮
图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();  
}

关于作者

歪脖先生,十五年以上软件开发经验,酷爱Web开发,精通 HTML、CSS、JavaScript、jQuery、JSON、Python、Less、Bootstrap等,著有《HTML宝典》、《揭秘CSS》、《Less简明教程》、《JSON教程》、《Bootstrap2用户指南》、《Bootstrap3实用教程》,并全部在 GitHub 上开源。

如果本教程对您帮助很大,请随意打赏。您的支持,将鼓励我写出更好的教程!

← 键盘方向键翻页 →
返回顶部 手机访问 关注微信 返回底部

扫码访问歪脖网

随时随地,想看就看

关注歪脖网微信

分享 web 知识、交流 web 经验