Form表单里的BUTTON的type='submit'和'button'的区别

最新推荐文章于 2023-02-13 08:27:15 发布

原创最新推荐文章于 2023-02-13 08:27:15 发布 · 2.4k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#表单

BootStrap 专栏收录该内容

9 篇文章

订阅专栏

本文介绍了如何使用HTML和JavaScript处理表单提交及按钮点击事件。具体包括两种情况：一是使用submit类型的按钮并通过onsubmit属性触发表单验证；二是使用button类型的按钮结合onclick事件进行表单验证。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.submit 用于提交表单时使用 οnsubmit=”“

<form class="form-horizontal" onsubmit="checkform()">
      <div class="control-group">
        <label class="control-label" for="inputEmail">Email</label>
        <div class="controls">
          <input type="text" id="inputEmail" placeholder="Email">
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" for="inputPassword">Password</label>
        <div class="controls">
          <input type="password" id="inputPassword" placeholder="Password">
        </div>
      </div>
      <div class="control-group">
        <div class="controls">
          <label class="checkbox">
            <input type="checkbox"> Remember me
          </label>
          <button type="submit" class="btn">Sign in</button>
        </div>
      </div>
    </form>

2.button时使用 onclick()方法

   <form class="form-horizontal" >
      <div class="control-group">
        <label class="control-label" for="inputEmail">Email</label>
        <div class="controls">
          <input type="text" id="inputEmail" placeholder="Email">
        </div>
      </div>
      <div class="control-group">
        <label class="control-label" for="inputPassword">Password</label>
        <div class="controls">
          <input type="password" id="inputPassword" placeholder="Password">
        </div>
      </div>
      <div class="control-group">
        <div class="controls">
          <label class="checkbox">
            <input type="checkbox"> Remember me
          </label>
          <button type="button" onclick="checkform()" class="btn">Sign in</button>
        </div>
      </div>
    </form>

 <script type="text/javascript">
    function checkform(){
  a=$("#inputEmail").val();
    if(a==""){
      alert('1');
    }
    }
 </script>