解决视频OCX在调用云台指令使用鼠标事件来发起和结束指令动作无效

柔情只为你懂 2023-07-10 14:27 4阅读 0赞

如题:OCX在调用云台指令使用mousedown和mouseup来发送指令和结束指令动作不起作用问题（视频播放和检索在requireJS封装都是正常的）。

![20200303125542936.png][]

在项目中使用requireJS封装了视频控件，但是在指令调用这块始终有问题，经过分析和测试发现：

*  mousedown和mouseup间隔时间一般只有100多ms
 *  ocx方法直接调用可以请求，说明ocx不能离开上下文
 *  mousedown和mouseup事件之间肯定有某种因素干扰了执行（时间、空间皆有可能）

## requireJS封装 ##

下面的方法采用requrejs封装调用：

/* $("#yt_direction_top").on('mousedown',function(){
         upstart();
    }); */
    function upstart(){
        require(['videoStart'],function(video){
            video.upstart();
        });
    }
    /* $("#yt_direction_top").on('mouseup',function(){
         upstop();
    }); */
    function upstop(){
        require(['videoStart'],function(video){
            video.upstop();
        });
    }
    /* $("#yt_direction_bottom").on('mousedown',function(){
         downstart();
    }); */
    function downstart(){
        require(['videoStart'],function(video){
            video.downstart();
        });
    }
    /* $("#yt_direction_bottom").on('mouseup',function(){
         downstop();
    }); */
    function downstop(){
        require(['videoStart'],function(video){
            video.downstop();
        });
    }
    /* $("#yt_direction_left").on('mousedown',function(){
         leftstart();
    }); */
    function leftstart(){
        require(['videoStart'],function(video){
            video.leftstart();
        });
    }
    /* $("#yt_direction_left").on('mouseup',function(){
         leftstop();
    });  */
    function leftstop(){
        require(['videoStart'],function(video){
            video.leftstop();
        });
    }
    /* $("#yt_direction_right").on('mousedown',function(){
         rightstart();
    }); */
    function rightstart(){
        require(['videoStart'],function(video){
            video.rightstart();
        });
    }
    /* $("#yt_direction_right").on('mouseup',function(){
         rightstop();
    }); */
    function rightstop(){
        require(['videoStart'],function(video){
            video.rightstop();
        });
    }
    /* $("#yt_zoom_add").on('mousedown',function(){
         ZOOMstart();
    }); */
    function ZOOMstart(){
        require(['videoStart'],function(video){
            video.ZOOMstart();
        });
    }
    /* $("#yt_zoom_add").on('mouseup',function(){
         ZOOMstop();
    }); */
    function ZOOMstop(){
        require(['videoStart'],function(video){
            video.ZOOMstop();
        });
    }
    /* $("#yt_zoom_reduce").on('mousedown',function(){
         REDUCEZOOMstart();
    }); */
    function REDUCEZOOMstart(){
        require(['videoStart'],function(video){
            video.REDUCEZOOMstart();
        });
    }
    /* $("#yt_zoom_reduce").on('mouseup',function(){
         REDUCEZOOMstop();
    });  */
    function REDUCEZOOMstop(){
        require(['videoStart'],function(video){
            video.REDUCEZOOMstop();
        });
    }
    /* $("#yt_focus_add").on('mousedown',function(){
         FOCUSstart();
    }); */
    function FOCUSstart(){
        require(['videoStart'],function(video){
            video.FOCUSstart();
        });
    }
    /* $("#yt_focus_add").on('mouseup',function(){
         FOCUSstop();
    });  */
    function FOCUSstop(){
        require(['videoStart'],function(video){
            video.FOCUSstop();
        });
    }
    /* $("#yt_focus_reduce").on('mousedown',function(){
         REDUCEFOCUSstart();
    }); */
    function REDUCEFOCUSstart(){
        require(['videoStart'],function(video){
            video.REDUCEFOCUSstart();
        });
    }
    /* $("#yt_focus_reduce").on('mouseup',function(){
         REDUCEFOCUSstop();
    }); */
    function REDUCEFOCUSstop(){
        require(['videoStart'],function(video){
            video.REDUCEFOCUSstop();
        });
    }
    /* $("#yt_aperture_add").on('mousedown',function(){
         APERTUREstart();
    }); */
    function APERTUREstart(){
        require(['videoStart'],function(video){
            video.APERTUREstart();
        });
    }
    /* $("#yt_aperture_add").on('mouseup',function(){
         APERTUREstop();
    });  */
    function APERTUREstop(){
        require(['videoStart'],function(video){
            video.APERTUREstop();
        });
    }
    /* $("#yt_aperture_reduce").on('mousedown',function(){
         REDUCEAPERTUREstart();
    }); */
    function REDUCEAPERTUREstart(){
        require(['videoStart'],function(video){
            video.REDUCEAPERTUREstart();
        });
    }
    /* $("#yt_aperture_reduce").on('mouseup',function(){
         REDUCEAPERTUREstop();
    }); */
    function REDUCEAPERTUREstop(){
        require(['videoStart'],function(video){
            video.REDUCEAPERTUREstop();
        });
    }

## OCX html页面的纯调用方式 ##

下面的跟<object > 控件在同一页面声明调用：

解决方法：抽离这部分mousedown和mouseup方法在页面中直接调用，不需要再封装处理。

[20200303125542936.png]: https://img-blog.csdnimg.cn/20200303125542936.png