黑马程序员技术交流社区

标题: 【广州前端】常用的前端代码片段(三) [打印本页]

作者: AMay 时间: 2018-12-20 15:54
标题: 【广州前端】常用的前端代码片段(三)

【简介】

在开发中，有一些代码段的使用频率是非常高，或者有些只是偶尔用到，但是属性又很难记，那么这里把它做一个总结，方便查阅。

【页面开启摄像头】

[JavaScript] 纯文本查看 复制代码

<!DOCTYPE html>



<html lang="en">



 



<head>



  <meta charset="UTF-8">



  <meta name="viewport" content="width=device-width, initial-scale=1.0">



  <meta http-equiv="X-UA-Compatible" content="ie=edge">



  <title>Document</title>



</head>



 



<body>



  <video src="" width="600" height="600" autoplay controls></video>



  <script>



    var video = document.querySelector("video");



 



    navigator.getUserMedia({



      video: true



    }, success, error);



    function success(stream) {



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



    }



    function error(err) {



      console.log(err);



 



    }



  </script>



</body>



 



</html>

效果图如下：

【js判断是否移动端及浏览器内核】

[JavaScript] 纯文本查看 复制代码

var browser = {



    versions: function() {



        var u = navigator.userAgent;



        return {



            trident: u.indexOf('Trident') > -1, //IE内核



            presto: u.indexOf('Presto') > -1, //opera内核



            webKit: u.indexOf('AppleWebKit') > -1, //苹果、谷歌内核



            gecko: u.indexOf('Firefox') > -1, //火狐内核Gecko



            mobile: !!u.match(/AppleWebKit.*Mobile.*/), //是否为移动终端



            ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios



            android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android



            iPhone: u.indexOf('iPhone') > -1 , //iPhone



            iPad: u.indexOf('iPad') > -1, //iPad



            webApp: u.indexOf('Safari') > -1 //Safari



        };



    }



}



 



if (browser.versions.mobile() || browser.versions.ios() || browser.versions.android() || browser.versions.iPhone() || browser.versions.iPad()) {



    alert('移动端');



}

【jquery的通过ajax发送文件资源给后台】

如果要用jq的ajax发送 formData对象给后台文件，需要设置两个属性

[JavaScript] 纯文本查看 复制代码

$.ajax({

      type:’post’,

      url:’xxxxx/xxxx.php’

      data:fd,

      processData:false, //设置JQuery不要去处理发送的数据

   contentType:false, //设置请求头中的ContentType为multipart/form-data

      success:function(res){}

})

作者: 一个人一座城0.0 时间: 2018-12-21 08:41
看一看。

欢迎光临黑马程序员技术交流社区 (http://bbs.itheima.com/)

黑马程序员IT技术论坛 X3.2