JS实现HTML 表单Form,提交Action的设置

function whichSubmit(v){
if(v==1){
document.form1.action="phonenoticehistory.readTelephone.do"
}else{
document.form1.action="phonenoticehistory.readTelephone.do"
}
document.form1.submit();
}
### 配置HTML `form`元素以实现表单提交HTML中,`<form>` 元素是用于收集用户输入并将其发送到服务器的核心组件之一。为了正确配置 `<form>` 元素以实现表单提交,需要关注以下几个关键属性: #### 1. **`action` 属性** 该属性指定了当表单提交时,数据被发送到哪个URL地址。如果没有指定此属性,默认情况下,表单数据会被提交给当前页面所在的URL[^2]。 ```html <form action="/submit"> </form> ``` #### 2. **`method` 属性** `method` 属性定义了表单数据提交的方式,通常取值为 `"GET"` 或 `"POST"`。 - 使用 `"GET"` 方法时,表单数据会附加在 URL 后面作为查询字符串传递,适合传输少量非敏感数据。 - 使用 `"POST"` 方法时,数据会在请求体中发送,适用于较大或敏感的数据传输。 ```html <form method="POST"> </form> ``` #### 3. **表单字段** 表单中的每个输入控件都需要有一个唯一的 `name` 属性,以便服务器可以识别这些字段及其对的值。常见的输入类型包括文本框 (`type="text"`)、电子邮件输入框 (`type="email"`) 和密码框 (`type="password"`) 等。 ```html <label for="username">用户名:</label> <input type="text" id="username" name="username"><br><br> <label for="password">密码:</label> <input type="password" id="password" name="password"><br><br> ``` #### 4. **提交按钮** 表单提交操作由 `<button>` 或 `<input>` 类型为 `"submit"` 的元素触发。点击此类按钮后,浏览器将按照设定的 `action` 和 `method` 提交表单数据。 ```html <button type="submit">提交</button> <!-- 或者 --> <input type="submit" value="提交"> ``` #### 5. **JavaScript 扩展功能** 如果希望增强用户体验或者执行更复杂的逻辑(如异步提交),可以通过 JavaScript 来控制表单行为。例如,使用 jQuery 实现 AJAX 提交可避免页面刷新[^4]。 ```javascript $('#myForm').on('submit', function(event) { event.preventDefault(); // 阻止默认提交动作 $.ajax({ url: $(this).attr('action'), // 获取 formaction 值 type: 'POST', data: $(this).serialize(), // 序列化表单数据 success: function(response) { console.log('成功:', response); }, error: function(xhr, status, error) { console.error('错误:', error); } }); }); ``` 以上代码展示了如何通过监听表单的 `submit` 事件来拦截默认提交流程,并借助 AJAX 将数据发送至目标地址。 ---
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值