<input type=file .>,这种上传浏览按钮,能添加背景图片吗

霖vv 发布于 2011/05/27 16:21
阅读 14K+
收藏 2

rt

加载中
1
霖vv
霖vv

引用来自#3楼“艺术家”的帖子

不用他的按钮就行了。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
        function F_Open_dialog() 
{ 
        document.getElementById("btn_file").click(); 
} 
        
//-->
</SCRIPT>
 <BODY>
 <input type="file" id="btn_file" name="btn_file" value="test" style="display:none"> 
 <input type="button" name="btn_abc" value="浏览" onclick="F_Open_dialog()"> 

 </BODY>
</HTML>

 我用jquery-form来ajax提交该表单,不能提交。

0
帅气的鱼
帅气的鱼

以前尝试过不行 可能技术不够 不过很多都不是用的图片

0
疯狂的艺术家
疯狂的艺术家

不用他的按钮就行了。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
        function F_Open_dialog() 
{ 
        document.getElementById("btn_file").click(); 
} 
        
//-->
</SCRIPT>
 <BODY>
 <input type="file" id="btn_file" name="btn_file" value="test" style="display:none"> 
 <input type="button" name="btn_abc" value="浏览" onclick="F_Open_dialog()"> 

 </BODY>
</HTML>
0
疯狂的艺术家
疯狂的艺术家

是不是因为隐藏的关系?

0
霖vv
霖vv

引用来自#5楼“艺术家”的帖子

是不是因为隐藏的关系?

 根据我的 初步测试,貌似是这样的原因。

0
疯狂的艺术家
疯狂的艺术家

看jquery-form 能不能提交隐藏元素吧

0
疯狂的艺术家
疯狂的艺术家

查了一下官方的文档,也就是说,被隐藏的域实际上传过去啦,只是名称变了前面加个了前缀“invisible-

 

Hidden controls and controls that are not rendered because of style sheet settings may still be successful. For example:

<FORM action="..." method="post">
<P>
<INPUT type="password" style="display:none"  
          name="invisible-password"
          value="mypassword">
</FORM>

will still cause a value to be paired with the name "invisible-password" and submitted with the form.

0
呆瓜
呆瓜

引用来自#4楼“赵霖”的帖子

引用来自#3楼“艺术家”的帖子

不用他的按钮就行了。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
        function F_Open_dialog() 
{ 
        document.getElementById("btn_file").click(); 
} 
        
//-->
</SCRIPT>
 <BODY>
 <input type="file" id="btn_file" name="btn_file" value="test" style="display:none"> 
 <input type="button" name="btn_abc" value="浏览" onclick="F_Open_dialog()"> 

 </BODY>
</HTML>

 我用jquery-form来ajax提交该表单,不能提交。

这段代码是有问题的,浏览器的安全策略里面是不允许通过js来模拟点击文件域的,这样打开了文件上传框,选择的文件时不会上传的。一般如果需要个性化上传按钮,就是在此按钮上放了一个透明的文件域,这样点击按钮的时候其实点击了附着在此按钮上面的那个透明的文件域。

碌木
碌木
ie也不能兼容,ie下的file input,单击“浏览”按钮弹出选择文件窗口,但是文本输入窗口,需要双击才能弹出文件选择窗口
呆瓜
呆瓜
可以的,一直就是这么弄的,各个浏览器都兼容的,这个是最基本的css样式,不管什么浏览器都兼容的。
罪恶的花生
罪恶的花生
不能兼容火狐
0
杨同学
杨同学

报告红薯老大,我用UC上OSChina的时候 帖子列表里这篇帖子的标题会显示一个上传文件的框框,你木有过滤掉

返回顶部
顶部