javascript post-submit不同于input-submit点击
javascript post submit different from input submit click?
我有这个代码
<html>
<include jquery>
<script>
function crea()
{
var html = '<form method="get" id="popUpForm" name="popUpForm" action="form_ricorda_dati.php"><hr /><input type="hidden" name="mio" value="1" />input3<input type="text" name="input3" value="" /><br />input4<input type="text" name="input4" value="" /><br /><input type="submit" id="11" value="Procedi" /></form><br /><a href="" onClick="prova()">submit</a>';
var div = document.getElementById('cont');
div.innerHTML = html;
}
function prova()
{
$('#popUpForm').submit();
}
</script>
<body>
< a href="#" onClick="crea()">lancia funzione JS</a><br /><br />
<div id="cont"></div>
</body>
</html>
此代码:
- 当我点击
<a href="#" onClick="crea()">
时,它会"显示"表单进入<div id="cont">
- 方式1:当我单击
<a href="" onClick="prova()">submit</a>
时,它会调用$('#popUpForm').submit();
方式2:单击<input type="submit" id="11" value="Procedi" />
问题:
如果我单击
<input type="submit" id="11" value="Procedi" />
I重新加载页面并查看正确的查询字符串(表单action="get"
)。在里面重新加载的页面,如果我"显示"表单并单击输入我看到最后一个输入(浏览器自动填充正常)。如果我单击
<a href="" onClick="prova()">submit</a>
,之后,我看不到查询字符串。在重新加载的页面中,如果我"显示"表单和点击输入我看不到最后一个输入(浏览器自动填充失败)。
(我在Chrome和IE中看到了这个问题,但在Firefox中没有。)
目标
浏览器自动填充应始终显示。
问题可能是您使用JavaScript创建的HTML表单在加载页面时不在浏览器的DOM中。您可以通过将表单的HTML放入要在DOM中呈现的body
标记中,并使用JavaScript隐藏它,直到用户单击crea
链接来解决此问题。
问题编号2似乎是您的链接(<a href="" onclick="prova()"...
)可能指向HREF
属性中给定的url。由于该属性为空,因此页面将返回到自身。
为了简化操作,您应该将HTML表单排除在JavaScript逻辑之外。此外,由于您使用的是jQuery,我已将您的函数转换为绑定。
JSFIddle中的工作示例。
<html>
<head>
<script type="text/javascript" src="url/to/jquery.js"></script>
<script type="text/javascript">
jQuery(function(){
var form = jQuery( '#form' ),
crea = jQuery( '#creaLink' ),
prova = jQuery( '#provaLink' );
form.hide();
crea.on( 'click', function(){
form.show();
});
prova.on( 'click', function(){
form.submit();
});
});
</script>
</head>
<body>
<a href="#" id="creaLink">lancia funzione JS</a>
<br />
<br />
<div id="form">
<form method="post" id="popUpForm" name="popUpForm">
<hr />
<input type="hidden" name="mio" value="1" />
input3
<input type="text" name="input3" value="" />
<br />
input4
<input type="text" name="input4" value="" />
<br />
<input type="submit" id="11" value="Procedi" />
</form>
<br />
<a href="#" id="provaLink">submit</a>
</div>
</body>
</html>
依赖浏览器的自动填充可能不是一个好主意,因为不同的浏览器可能有不同的行为。现在,如果我的假设是正确的,即使在服务器上接收和处理表单数据之后,您也希望值出现在字段中,那么我建议您使用AJAX技术。将后台的表单数据发送到服务器,并在收到响应后仅显示结果。
- 分派点击事件并保留击键修饰符
- JavaScript下拉菜单-点击按钮并根据所选值重定向到url
- jquery点击函数select&取消选择
- ExtJS 5用程序点击actioncolumn gridview
- 我可以获得相对于被点击元素的确切点击位置吗
- 点击Codeigniter中的Form Submit
- 如果在sam页面的多个位置使用单个输入,如何使用submit类点击输入
- 如何调用“;点击“;输入类型“on input type”;文件“;通过调用其他元素的上下文
- javascript post-submit不同于input-submit点击
- 调用input的点击事件;不能在Safari中工作
- 点击表单外部的按钮,在表单中的submit按钮上调用submit
- 为什么当点击输入类型submit时,on('submit')函数从不被调用?
- 如何在点击'Submit'按钮
- ajax调用后不能点击input[type=radio]
- 如何在点击Submit按钮时生成警报,只有当html表单满时使用Javascript
- =“EmberJS; submit"和=“enter"通过鼠标点击而不是输入触发
- 关于.submit和在submit按钮被点击后重新加载表单值的问题
- 为什么这个“点击禁用=true;this.form.submit();' 在一个按钮上工作,但不能在另一个按钮上工作
- 使用'onbeforeunload',除非'Submit'点击
- 当用户点击'submit'- javascript或php