Html From 提交
关于Html form表单的提交,很容易。。。但如果不仔细还是能有很多错误。
提交的button name 属性为 submit form的submit方法失效
。代码如下
<html>
<head></head>
<script type="text/javascript">
function getData(){
document.forms[0].submit();
}
</script>
<body>
<form id="form1" name="form1" method="get" action="http://xiayuanfeng.iteye.com">
<input type="button" name="submit" onclick="getData();" value="提交">
</form>
</body>
</html>
如果改为
<html>
<head></head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function getData(){
document.forms[0].submit();
}
</script>
<body>
<form id="form1" name="form1" method="get" action="http://xiayuanfeng.iteye.com">
<input type="button" name="aa" onclick="getData();" value="提交">
</form>
</body>
</html>
成功提交。。
我们来看看原因
<html>
<head></head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
function getData(){
var objform = document.forms[0]
for(var i in objform){
if(i.indexOf("submit")!=-1){
alert(i+" ="+objform[i]);
}
}
}
</script>
<body>
<form id="form1" name="form1" method="get" action="http://xiayuanfeng.iteye.com">
<input type="text" name="aa">
<input type="button" name="submit" onclick="getData();" value="提交">
</form>
</body>
</html>
发现 submit已经变成 form 的一个属性了,并不是方法。这下明白了吧。把submit(也就是submit方法)覆盖了。所以要注意提交表单name的命名方式不要和form原有的方法,属性相同,这样会导致原来的form属性方法失效。
分享到:
相关推荐
1. **表单提交(Form Submission)**:HTML表单通过`<form>`元素定义,其中包含`<input>`、`<select>`、`<textarea>`等元素来获取用户输入。默认情况下,表单提交会引发页面重定向,使用`<form>`的`action`属性指定...
1. **HTML Form提交**:HTML `<form>` 元素用于创建用户输入数据的表单,这些数据可以被发送到服务器进行处理。通过设置`<form>`的`action`属性,你可以指定表单提交后应跳转的URL。`method`属性(通常是`get`或`...
首先,在HTML表单中,为了避免在提交时页面刷新导致的重复提交,可以在<form>标签中使用onsubmit="return false;"属性。这个属性的作用是在表单提交时返回false,阻止浏览器执行默认的提交行为,即刷新页面。但仅仅...
本文将详细介绍在form提交时传递额外参数的几种常见方法,并分析各自的优缺点,供开发者根据实际需求进行选择。 1. 在表单里使用隐藏的input元素 这是最简单也是最直接的方法。可以在表单HTML代码中直接添加一个...
1. **引入库**:在HTML文件中,通过`<script>`标签引入`jQuery`和`jQuery.form.js`。 2. **初始化表单**:使用`$.ajaxForm()`或`$('form').submit(function() {...})`绑定提交事件。 3. **异步提交**:`$.ajaxSubmit...
在HTML中,表单的默认提交方式是通过`<form>`标签的`action`属性指定的URL进行POST或GET请求。然而,这种方式缺乏灵活性,无法在提交前进行数据验证或添加额外的请求头。jQuery提供了一种更方便的API来控制表单提交...
AjaxForm是jQuery Form Plugin的一个功能,用于实现异步表单提交,特别是处理包含图片在内的复杂数据。本文将深入探讨如何使用ajaxForm进行异步表单提交。 首先,让我们了解什么是Ajax。AJAX(Asynchronous ...
在HTML页面中,表单(`form`)是用于收集用户输入数据的元素,而JSON(JavaScript Object Notation)是一种轻量级的数据交换格式,常用于前后端数据传输。本篇将详细介绍如何在HTML表单中收集数据,并利用jQuery的`...
jQuery.form插件正是为了满足这种需求而设计的,它扩展了jQuery库,使表单异步提交变得更加简单、灵活且强大。本文将详细介绍如何使用jQuery.form插件,实现完美的表单异步提交。 首先,我们需要了解jQuery.form...
jQuery Form插件是基于jQuery的一个强大工具,它可以轻松地将任何HTML表单转换为异步提交,实现无刷新的数据交换。这个插件的核心功能是通过Ajax技术发送表单数据,无需离开当前页面,提高了用户的交互性。 ### ...
在PHP开发中,有时我们需要模拟用户通过HTML表单提交数据,包括文件和图片。`cURL`库提供了一个强大的功能,允许我们实现这样的任务。在本文中,我们将深入探讨如何使用PHP的cURL库来模仿form表单提交,特别是提交...
在Web开发中,尤其是使用JavaServer Pages (JSP)时,Form表单的重复提交问题是一个常见的挑战。这可能导致数据不一致性和服务器资源的浪费。本文将探讨三种防止JSP表单重复提交的方法。 首先,我们可以使用...
ASP.NET Form提交的图片批量上传是一项常见的Web开发任务,它涉及到客户端与服务器之间的数据交互,以及文件处理技术。在这个过程中,用户可以选择多张图片并一次性发送到服务器进行存储或处理。下面将详细介绍这个...
HTML5为form元素引入了formaction属性,允许开发者针对单个提交按钮指定不同的提交地址。这可以帮助我们对每个按钮提交的数据进行区分,从而避免URL参数的冲突。示例代码如下: ```html <form> ...
这三种方法各有特点,$.post()适合简单的POST请求,$.ajax()则提供了更多自定义选项,适用于复杂的请求逻辑,而ajaxForm()则是针对整个表单的提交,特别适合已有的HTML表单,无需手动构建请求数据。 在实际开发中,...
本文将深入探讨“jQuery异步提交form表单”这一主题,结合给出的标签“源码”和“工具”,我们将分析相关源码,并提供实际应用中的指导。 在传统的HTML表单提交过程中,页面会跳转到服务器返回的结果页面,这在用户...
本实例演示将深入探讨如何使用AJAX来提交HTML Form表单,从而提供更流畅的用户体验。我们将使用jQuery库,因为它简化了JavaScript的AJAX操作。 首先,确保在项目中引入jQuery库。这可以通过在HTML文件的`<head>`...
"不用form提交表单,用ajax上传文件"是这种需求的一个典型场景。这种方式可以让用户在上传文件时无需等待页面刷新,而是通过Ajax(Asynchronous JavaScript and XML)技术实现实时反馈,提升交互体验。 在JDK 8版本...
总的来说,处理具有相同`name`的复选框提交问题,需要理解HTML表单的提交机制,以及如何在客户端和服务器端进行适当的转换。合理的设计和适当的JavaScript辅助能帮助我们解决这个问题,确保所有选中的复选框值都能被...
回 false, 不提交,如果不为空,提交到由...总的来说,HTML `<form>`表单结合JavaScript的验证功能,为用户提供了一种交互式的、安全的数据输入和提交机制。理解这些基本概念对于开发动态、响应式的Web应用至关重要。