0

我有以下html代码:

<span id="video-teaser">
    <span>Click here for a <strong>FREE</strong> hot video</span>
    <video src="http://example.com/videos/nakednews.mp4" controls="" poster="http://example.com//img/iphone-video-btn.png" id="videoTeaser" height="1"></video>
</span>

我试图想出两种解决方案..使用javascript addlistener..并在按下视频时触发视频。

     <script type="text/javascript">
            var video = document.getElementById('videoTeaser');
            var elementToTrigger=document.getElementById('video-teaser');
                    elementToTrigger.addEventListener('click',function(){
                    video.play();
                    },false);
      </script>

两种解决方案都不起作用..当我在网站的 pc 版本上单击视频预告片时,视频本身就可以工作..

这可能是什么解决方案..

4

3 回答 3

2

尝试在http://code.google.com/p/html5webview/source/checkout的 svn 链接中给出的代码,它工作正常

于 2012-04-18T12:47:58.403 回答
1

这是 Android < 4.0 的已知问题

这是一个工作量:

在您的网络视图中,您必须设置自己的 ChromeClient
并覆盖此功能:

        _customViewCallback = callback;
        if (view instanceof FrameLayout){  
             FrameLayout frame = (FrameLayout) view;  
             if (frame.getFocusedChild() instanceof VideoView){  
                 final VideoView video = (VideoView) frame.getFocusedChild(); 
                 _customView = video;
                 frame.removeView(video);  
                 Activity a = (Activity)_context;
                 a.setContentView(video);  
                 video.setOnCompletionListener(new OnCompletionListener() {  

                    @Override  
                    public void onCompletion(MediaPlayer mp) { 
                        mp.stop();
                        video.stopPlayback();
                        onHideCustomView();
                    } 
                });  
                 video.setOnErrorListener(new OnErrorListener() {  

                    @Override  
                    public boolean onError(MediaPlayer mp, int what, int extra) {  
                        return false;  
                    }  
                });  
                 if (!video.isPlaying())
                     video.start();  
             }  
         }  

并覆盖OnHideCustomView以添加您的处理并添加(以便您的视频可以再次打开):

_customViewCallback.onCustomViewHidden();

这些链接可能对您有所帮助:

WebView 和 HTML5 <视频>

如何使用android在webview中播放视频?

WebView 不打开 android 默认视频播放器?

于 2012-04-18T11:59:25.217 回答
0

加载 span 标签的内容后,script 标签内的代码将起作用 将 script 标签放在 span 标签下面,如下所示

<span id="video-teaser">
    <span>Click here for a <strong>FREE</strong> hot video</span>
    <video src="http://example.com/videos/nakednews.mp4" controls="" poster="http://example.com//img/iphone-video-btn.png" id="videoTeaser" height="1"></video>
</span>

 <script type="text/javascript">
            var video = document.getElementById('videoTeaser');
            var elementToTrigger=document.getElementById('video-teaser');
                    elementToTrigger.addEventListener('click',function(){
                    video.play();
                    },false);
      </script>
</body>
于 2012-04-18T11:54:54.217 回答