layui upload videos and a long time to get video method

When you upload a video layui official did not provide direct long way to get video, we need to get indirect

When adding a long HTML <video> tag, because the video tags can help us get video

<video id="videoattr" width="250" height="100" ></video>

Of course, you can also set to hide.

Then you can use JS <video> to obtain a long duration.

// simultaneously binding a plurality of elements, the elements and the attributes set 
upload.render ({ 
    elem: '.upload-MENU' , 
    URL: 'http://upload-z2.qiniup.com', // upload to seven cattle cloud 
    Multiple: false , // whether to allow true multi-file upload settings to open does not support IE8 / 9.. 
    bindAction: '# the Add' , 
    the Accept: 'Video' , 
    size: 10240, // KB, can not be greater than 1OM 
    Auto: to false , // automatically upload 
    Data: { 
        token: function () {
             var token; 
            $ .ajax ({ 
                the async:to false , // Ajax asynchronously acquiring non taken 
                type: 'POST' , 
                URL: '{: URL (' Articles / getToken to ')}', 
                Success: function (RES) { 
                    token = RES; 
                } 
            }); 
            return token; 
        } 
    }, 
    the Choose: function (obj) {
         // prefetch exemplary local file, do not support IE8 
        layer.load (2 ); 
        obj.preview ( function (index, file, Result) {
             var URL = URL.createObjectURL (file); //The file converted into the URL 
            $ ( '# videoattr') attr ( 'the src', URL);. // video link 
            var Timer = the setTimeout ( function () { 
                layer.close (layer.index); 
                var video_time = document.getElementById ( "videoattr") DURATION;. // video length 
                the console.log (video_time);
                 IF (video_time> 60 ) { 
                    layer.msg ( 'uploaded video is not more than 60 seconds', {icon: 2 }) 
                } the else { 
                    $ ( '#add') css ( "visibility ", "visible").;// start first confirm the upload button hidden, long before opening time to get video
                 }
                the clearTimeout (Timer); 
            }, 1000 ); 
        }); 
    }, 
    before: function (obj) {
        // the console.log (obj); 
        layer.msg ( 'upload ...' , { 
            icon: 16 , 
            Shade: 0.01 , 
            Time: 0 
        }) 
    }, 
    DONE: function (RES) { 
        the console.log (res.data); 
        // return to false; 
        layer.close (layer.msg ( 'success!')); // The following are the subsequent upload pictures displayed 
        var html='<div class="thumb-list"><i class="layui-icon close-icon">&#x1006;</i><img src="'+res.data.src+'" title="'+res.key+'"></div>';
        $('.thumb-box').append(html);
        thumb.push(res.data.src);
        if($('.thumb-list').length == 9){
            $('.upload-menu').hide();
        }
    }
    ,error: function(){
        layer.msg('上传错误！');
    }
});

First start the upload button to confirm hide, prevent not get video length has already begun to upload parameters lead to errors and other issues.

Further, the timer must be set setTimeout, because the code is executed in parallel, to prevent the <video> has not been loaded on to it gets long, the result thus obtained will be NaN