在js校验表单元素的时候,经常会出现如果某项为空,弹出....为空,并且把当前的<input type="text">那栏激活,光标指向当前激活的
在提交的时候一般有2种
1.一种为submit提交, 也称点击后自动提交
2.另一种button,需要调用form.submit()方法,手动提交
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> button/submit</TITLE>
<script type="text/javascript">
function subfrom(){
var name=document.getElementById("name");
if(name.value==""){
alert("用户名不能为空");
name.focus();
return false;
}
}
function tjbtn(){
var name2=document.getElementById("name2");
if(name2.value==""){
alert("username不能为空");
name2.focus();
}else{
document.getElementById("form").submit();
}
}
</script>
</HEAD>
<BODY>
<!--当按钮为submit时,自动会提交,需要用form的 onsubmit事件,值为空的时定义到当前的input-->
<form action="" onsubmit="return subfrom();">
<table>
<tr>
<td>用户名</td>
<td><input type="text" id="name" name="name"></td>
</tr>
<tr>
<td>密码</td>
<td><input type="password" id="password" name="password"></td>
</tr>
<tr>
<td rowspan="2"><input type="submit" id="subbtn" name="subbtn" value="提交"></td>
</tr>
</table>
</form>
<br><br>
<br><br>
<!--如果提交的类型是button的时候,需要手动提交form表单-->
<form id="form" action="submit_button.html">
<table>
<tr>
<td>username</td>
<td><input type="text" id="name2" name="name2"></td>
</tr>
<tr>
<td>password</td>
<td><input type="password" id="password" name="password2"></td>
</tr>
<tr>
<td rowspan="2">
<input type="button" onclick="tjbtn()" value="submit">
</td>
</tr>
</table>
</form>
</BODY>
</HTML>
最近就纠结到js上了...悲剧...
分享到：
相关推荐
在form表单提交中，使用button来间接完成submit的提交更为灵活。下面是实现方法： 使用button按钮实现submit提交，需要在button标签中的使用onclick方法，然后在JavaScript中实现具体，代码如下： <head> ...
2. **灵活性**：`button`提供了更多的编程灵活性，可以用来触发自定义的JavaScript事件，而`submit`更专注于表单的提交功能。 3. **应用场景**：如果你只需要一个用于提交表单的简单按钮，`submit`是一个不错的选择...
首先，`submit`是一个特殊的`button`类型，它默认具有提交表单的功能。当用户点击`submit`类型的按钮或按下回车键时，表单中的数据会被发送到服务器进行处理。如果在表单中只有一个`submit`按钮，那么点击这个按钮就...
submit表单提交，onsubmit验证拦截 免去了用button按钮click点击事件ajax请求
var submitButton = document.getElementById('submitButton'); if (!submitButton.disabled) { submitButton.disabled = true; // 提交表单的逻辑 } }); ``` 2. **使用一次性令牌（Token）**：服务器可以...
在一个网页表单(form)中，通常我们通过设置不同的提交按钮(submit或button)来实现将数据提交至不同的处理页面。然而，在某些特定情况下，我们可能需要仅使用一个提交按钮(submit或button)来将表单数据同时提交到两个...
<button type="submit">提交</button> </form> ``` 现在，我们可以使用jQuery选择器选取表单元素，并调用`.ajaxSubmit()`方法实现异步提交： ```javascript $(document).ready(function() { $('#myForm')....
document.getElementById('submitButton').disabled = true; // 禁用提交按钮 // 或者，阻止表单的默认提交事件（需要在表单的submit事件处理函数中） document.getElementById('yourFormId').addEventListener...
标题 "在IE的模式窗口中，通过表单提交到本页，并通过javascript获取提交的参数" 描述了一种常见的Web开发技术应用场景。在Internet Explorer（IE）浏览器的特定模式下，用户通过表单填写信息并提交后，这些数据通常...
今天在使用表单是同时使用POST...然而form表单的 submit 且一旦提交则全部提交，所以想到的实现方法就是 使用button实现,怎么实现呢？下面小编给大家分享JS button按钮实现submit按钮提交效果，感兴趣的朋友参考下吧
<button id="openForm">打开表单</button> ;"> 姓名：</label><input type="text" id="name" name="name"><br> 邮箱：</label><input type="email" id="email" name="email"><br> <input type="submit" value=...
<button type="submit">提交</button> </form> ``` ### 2. 阻止默认表单提交 为了让AJAX提交生效，我们需要阻止表单的默认提交行为。这通常在表单的`submit`事件处理器中完成： ```javascript document....
- **设置默认提交按钮**：通过设置`form`属性，将某个按钮指定为表单的默认提交按钮，例如`<button form="myForm" type="submit">提交</button>`。 - **监听键盘事件**：使用JavaScript，通过监听`keyup`或`keydown`...
<button type="submit" id="submitBtn">提交</button> </form> document.getElementById('myForm').addEventListener('submit', function(event) { event.preventDefault(); // 阻止默认的表单提交行为 var btn...
submit是button的一个特例，也是button的一种，它把提交这个动作自动集成了。 如果表单在点击提交按钮后需要用JS进行处理（包括输入验证）后再提交的话，... 两者主要区别在于： submit默认为form提交，可以提交表单
<button class="layui-btn" lay-submit lay-filter="open-layer-form">打开表单弹窗</button> ``` 5. 编写弹窗逻辑： 在`layui.use()`回调函数中，编写点击按钮时弹出表单的逻辑。这通常包括创建表单结构、监听...
当用户点击`<form>`元素内的`<input type="submit">`或`<button type="submit">`时，浏览器会按照`<form>`标签的`action`属性指定的URL发送表单数据，并根据`method`属性（默认为`GET`或`POST`）确定请求类型。...
<button type="submit">提交</button> </form> ``` 为了实现AJAX提交，我们需要在页面加载完成后绑定一个事件监听器到表单的提交事件。在`<script>`标签中编写以下jQuery代码： ```javascript $(document).ready...
在网页设计中，有时我们希望使用更具视觉吸引力的元素，比如图像（Image）来替代传统的按钮（Button）作为表单的提交方式。标题和描述提到的问题是如何使用图像提交表单而不触发双重提交的问题。双重提交可能导致...
表单通常包含各种输入元素，如文本字段`<input type="text">`，密码字段`<input type="password">`，以及提交按钮`<input type="submit">`。 二、密码验证 为了确保用户安全，密码验证是必不可少的。在前端，可以...