本篇文章给大家谈谈谷歌浏览器input file，以及谷歌浏览器input标签里输入不了中文对应的知识点，文章可能有点长，但是希望大家可以阅读完，增长自己的知识，最重要的是希望对各位有所帮助，可以解决了您的问题，不要忘了收藏本站喔。

本文目录

1. iframe在谷歌浏览器中与在ie、火狐中显示不一致问题!
2. html 中的 input,怎样触发 iOS 中不同类型的键盘
3. 如何html5在浏览器里访问手机后置摄像头
4. ie浏览器弹出failedtoreadinput
5. input文本框在谷歌浏览器下默认的黄色背景怎么回事
6. 在火狐浏览器中input file的change事件无法执行应该怎样解决

一、iframe在谷歌浏览器中与在ie、火狐中显示不一致问题!

尊敬的用户，您好！很高兴为您答疑

您说的这个问题应该不是iframe的问题，这实际上是上传控件的问题。而控件是内建于浏览器内核中的，所以您如果期望实现外观一致，只能求助于利用js进行上传控件的重写。比较常见的方式是，存放一个隐藏的上传控件，然后通过修饰好外观的input等控件向其内部传值和注入，当然，最好的办法还是使用基于jQuery的上传插件，如：jUploader等。

要让file在各个浏览器显示统一，用js脚本。基本步骤：

1、通过文本框和按钮去模拟一个input type=”file”。

2、把input="file"做成透明，用定位完全盖住文本框和按钮。

3、当input type=”file”的onchange的时,用js将文本框的值设置成input type=”file”的值。

希望我的回答对您有所帮助，如有疑问，欢迎继续咨询我们。

二、html 中的 input,怎样触发 iOS 中不同类型的键盘

1、E-mail:<input type="email" name="user_email"/>

2、iPhone中的 Safari浏览器支持 email输入类型，并通过改变触摸屏键盘来配合它（添加@和.com选项）。

3、Homepage:<input type="url" name="user_url"/>

4、iPhone中的 Safari浏览器支持 url输入类型，并通过改变触摸屏键盘来配合它（添加.com选项）。

5、Points:<input type="number" name="points" min="1" max="10"/>

6、iPhone中的 Safari浏览器支持 number输入类型，并通过改变触摸屏键盘来配合它（显示数字）。

7、具体内容可以参照w3cschool中html5下,表单的介绍

三、如何html5在浏览器里访问手机后置摄像头

html5需要使用接口chrome30+ for android已经实现了利用webcam，调用手机后置摄像头，代码如下：

<htmlxmlns="">

<title>HTML5GetUserMediaDemo</title>

<metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0"/>

<inputtype="button"title="开启摄像头"value="开启摄像头"onclick="getMedia();"/><br/>

<videoheight="120px"autoplay="autoplay"></video><hr/>

<inputtype="button"title="拍照"value="拍照"onclick="getPhoto();"/><br/>

<canvasid="canvas1"height="120px"></canvas><hr/>

<inputtype="button"title="视频"value="视频"onclick="getVedio();"/><br/>

<canvasid="canvas2"height="120px"></canvas>

<scripttype="text/javascript">

varvideo=document.querySelector('video');

varcanvas1=document.getElementById('canvas1');

varcontext1=canvas1.getContext('2d');

varcanvas2=document.getElementById('canvas2');

varcontext2=canvas2.getContext('2d');

navigator.getUserMedia=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;

window.URL=window.URL||window.webkitURL||window.mozURL||window.msURL;

MediaStreamTrack.getSources(function(sourceInfos){

for(vari=0;i!=sourceInfos.length;++i){

//这里会遍历audio,video，所以要加以区分

if(sourceInfo.kind==='video'){

'sourceId':exArray[1]//0为前置摄像头，1为后置

},successFunc,errorFunc);//success是获取成功的回调函数

alert('Nativedevicemediastreaming(getUserMedia)notsupportedinthisbrowser.');

//alert('Succeedtogetmedia!');

if(video.mozSrcObject!==undefined){

//Firefox中，video.mozSrcObject最初为null，而不是未定义的，我们可以靠这个来检测Firefox的支持

video.src=window.URL&&window.URL.createObjectURL(stream)||stream;

audioType=getAudioType(audio);

audio.src='polaroid.'+audioType;

//将视频帧绘制到Canvas对象上,Canvas每60ms切换帧，形成肉眼视频效果

functiondrawVideoAtCanvas(video,context){

window.setInterval(function(){

context.drawImage(video,0,0,90,120);

functiongetAudioType(element){

if(element.canPlayType('audio/mp4;codecs="mp4a.40.5"')!==''){

}elseif(element.canPlayType('audio/ogg;codecs="vorbis"')!==''){

//vedio播放时触发，绘制vedio帧图像到canvas

//video.addEventListener('play',function(){

//drawVideoAtCanvas(video,context2);

context1.drawImage(video,0,0,90,120);//将video对象内指定的区域捕捉绘制到画布上指定的区域，实现拍照。

drawVideoAtCanvas(video,context2);

</html>

HTML5 The Media Capture API提供了对摄像头的可编程访问，用户可以直接用getUserMedia获得摄像头提供的视频流。但实际上用html5调用手机摄像头存在很多问题：

HTML5 The Media Capture API提供了对摄像头的可编程访问，用户可以直接用getUserMedia获得摄像头提供的视频流。但实际上用html5调用手机摄像头存在很多问题：

1）谷歌的发布的Chrome到了21版本后，才新增了一个用于高质量视频音频通讯的getUserMedia API，该API允许Web应用程序访问摄像头和麦克风,其他手机浏览器只有opera支持html5调用本地拍照功能

2）两个浏览器均不支持访问多个摄像头：chrome不支持访问后置摄像头，pera支持访问后置摄像头的

四、ie浏览器弹出failedtoreadinput

电脑中的IE浏览器弹出错误提示的解决方法

当我们在电脑系统中使用IE浏览器浏览网页时，偶尔会出现是否只查看安全内容的提示，甚至有可能会出现页面显示不全的情况。我们一般遇到这种情况会选择继续查看网页内容，那么，应该如何设置才能去除这个提示，或者显示全部网页内容呢?

1、打开IE浏览器——Internet选项;

2、切换到“安全”选项卡，点击“自定义级别”;

3、在设置选项中找到“显示混合内容”，里面有三个选项“禁用”、“启用”和“提示”，选择“启用”后，可以显示全部网页内容，并取消提示;

4、点击确定后，会弹出警告，点击是即可。

电脑中的IE浏览器通过上述方法的操作步骤，以后就不会提示是否只查看安全内容或者再出现页面显示不全的情况

五、input文本框在谷歌浏览器下默认的黄色背景怎么回事

透明input，表单自动填充的黄色（常出现在谷歌浏览器）

1.将密码框设置为普通输入框，获得光标后改为密码框，缺点：密码框是正常了，用户名还是黄色的

input type="text" class="form-control input-pwd" required="" placeholder="请输入密码" name="idp_cred" onfocus="this.attr('type','password')"/>

2.关闭自动完成，在用户名框、密码框后面都加上关闭自动完成属性，缺点：部分谷歌浏览器会失效

input type="text" class="form-control" required="" placeholder="请输入" name="idp_cred" autocomplete="off"/>

3.将以上两个方法结合起来，用户名框、密码框关闭自动完成，密码框设置成普通输入框，获得光标后动态改为密码框，缺点：页面不简洁，优点：测试所有浏览器都有效

<input type="text" class="form-control input-user" required="" placeholder="请输入账号" name="idpUser" autocomplete="off"/>

<input type="text" class="form-control input-pwd" required="" placeholder="请输入密码" name="idp_cred" autocomplete="off" onfocus="$(this).attr('type','password')"/>

六、在火狐浏览器中input file的change事件无法执行应该怎样解决

1、据测试，该控件绑定的change事件是可以执行的。但是因为该控件在不同的浏览器下，视觉差异较大，为了保持功能一致性，推荐使用一个特有的事件载体，（如：图片、按钮等），然后将事件绑定在其上面，然后发生操作时，对操作结果的input值域进行比较，来识别事件触发的时机。

2、即通过该方式模拟change事件，可以起到一样的效果和更好的兼容。

如果你还想了解更多这方面的信息，记得收藏关注本站。