当我使用标签时,表单未在IE中提交
Form not submitted in IE when i use label
我有一个表格没有在IE中提交。我只想隐藏图像上传按钮(文件类型)并显示自定义浏览按钮。我的文件上传没有显示。当我单击标签时,我调用文件单击事件并选择一个文件。但是当我提交页面时,它没有提交它,控制台中没有错误消息。它在火狐中工作正常。
这是我的代码。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="robots" content="index, follow" />
<title>New world of interaction</title>
<script>
function checkFields()
{
var fup = document.getElementById('authenticationimage');
var fileName = fup.value;
var ext = fileName.substring(fileName.lastIndexOf('.') + 1);
if(ext == "jpg" || ext == "JPG")
{
return true;
}
else
{
alert("Upload Jpeg image only");
document.getElementById('imagename').innerHTML = '';
return false;
}
}
function readURL() {
var fup = document.getElementById('authenticationimage');
var fileName = fup.value;
document.getElementById('imagename').innerHTML = fileName;
}
function removeimage() {
document.getElementById('imagename').innerHTML = '';
}
</script>
</head>
<body>
<table border="0" cellpadding="10" cellspacing="10" width="100%" align="center">
<form action="test.php" method="post" enctype="multipart/form-data" onsubmit="return checkFields();">
<tr>
<td width="25%" style="padding-left:15px"><strong>Image</strong></td>
<td width="75%">
<table border="0">
<tr><td style="border:1px solid #596166;"><label id="imagename" style="width:200px;display:inline-block;"></label></td>
<td>
<div class="ImageUpload">
<label for="authenticationimage" onclick="document.getElementById('authenticationimage').click();">
<img src="browse.png" alt="Browse" style="width:60px;cursor: pointer;"/>
</label>
<input id="authenticationimage" name="authenticationimage" type="file" onchange="readURL()" style="display:none"/>
</div>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td></td>
<td height="20"><input type="submit" name="submit" value="submit" />
<input type="reset" name="reset" onclick="removeimage();" value="reset">
</td>
</tr>
</form>
</table>
</body>
</html>
它是通过使用 css 属性完成
的.select-wrapper {
background: url('templates/ncrcorp/images/upload.png') no-repeat;
background-size: cover;
display: block;
position: relative;
width: 60px;
height: 24px;
}
#authenticationimage {
width: 60px;
height: 24px;
opacity: 0;
cursor: pointer;
filter: alpha(opacity=0); /* IE 5-7 */
}
and
<span class="select-wrapper">
<input id="authenticationimage" name="authenticationimage" type="file" onchange="readURL()" />
</span>
相关文章:
- 当在coldfusion中通过AJAX传递时,FORM提交在IE浏览器中给出空表单
- jquery表单提交无法使用多个输入(IE和Firefox)
- writeln img src将数据提交到外部系统-Firefox和IE挂起
- 图片上传无法在IE中工作,表单未提交
- 表单提交后用Javascript更新表-在IE&边
- 提交输入不'不要在IE和Firefox中发布
- 为什么在IE和Chrome中提交表单不起作用
- 如何在IE手机版中绑定按键代码提交按钮
- j查询表单在IE中文件输入更改时自动提交
- 此代码阻止我的表单提交(仅在 chrome 中,适用于 IE 和 Firefox)
- 表单提交 - IE 访问被拒绝 - 同一域
- 输入类型提交的 IE 问题
- 不需要的文件在IE中提交后清除文本框
- 提交图像按钮的焦点在IE 8中未突出显示
- Ajax在Chrome / Safari中提交作品,但不能在Firefox / IE中提交作品
- IE 8-9 SCRIPT5:提交时Zugriff verweigert(访问被拒绝)
- 如何避免在非IE浏览器中使用pushState和$.ajax(hash)进行双重提交
- 另一种方法是让chrome、IE 8和firefox提交相同的表单
- 如何在IE中提交Anchor Javascript.在FF、Chrome和Safari中工作
- extJS和IE提交按钮损坏,但在firefox中工作