简体   繁体   English

多次遍历jQuery .post函数

[英]Loop through a jQuery .post function multiple times

So I am using the jsplayer HTML5 player on my wordpress site, as well as some custom script to load in the next post and replace the old content once the video is finished: 所以我在wordpress网站上使用jsplayer HTML5播放器,以及一些自定义脚本来加载下一篇文章,并在视频播放完毕后替换旧内容:

    $(document).ready(function(){
        $(".video-js").bind('ended', function(){
            var sStr = "<?php echo get_permalink(get_adjacent_post(true,'',true)); ?>";
            var adj_numb = "<?php 
                            $adj = get_adjacent_post(true,'',true); 
                            $numb = $adj->ID;
                            echo $numb
                            ?>";
            var cur_numb = "<?php echo $post->ID; ?>";
            $.post(sStr, function(data) {
                var content = $( data ).find( '#post-' + adj_numb);
                $( "#post-" + cur_numb ).html( content );
                var vid = VideoJS.setup( "vid" );
                vid.play();
            });
        });
    });

This works great, for exactly one video. 对于一部影片,效果很好。 It loads in the next video and plays it, but after the 2nd video plays it just stops. 它会在下一个视频中加载并播放,但是在第二个视频播放之后,它会停止播放。 I figure this means I have to sort of "reset" all my variables and start again from the beginning of the script, and that it's not doing this because of $(document).ready(function(), as it's already all loaded at this point. 我认为这意味着我必须对所有变量进行“重置”,然后从脚本的开头重新开始,并且由于$(document).ready(function(),它没有执行此操作,因为它已经全部加载到了这点。

Is there a standard way to loop through this script again, and re-set all the variables after its run once? 是否有一种标准方法可以再次遍历此脚本,并在运行一次后重新设置所有变量?

Thanks! 谢谢!

EDIT: Rendered JS: 编辑:渲染的JS:

    $(document).ready(function(){
        $(".video-js").live('ended', function(){
            var sStr = "http://www.theloniousfilms.com/zachmath/volkswagon/";
            var adj_numb = "94";
            var cur_numb = "96";
            $.post(sStr, function(data) {
                var content = $( data ).find( '#post-' + adj_numb);
                $( "#post-" + cur_numb ).html( content );
                var vid = VideoJS.setup( "vid" );
                vid.play();
            });
        });
    });

HTML: HTML:

<div class="post-96 post type-post status-publish format-standard hentry category-zachmath" id="post-96">
            <h2 id="director">Zach Math</h2>

            <h2 id="post_title">Orkin - 
                <span id="post_name">

                "Hot Tub"
                 </span>
                 <span id="home"><a href="http://www.theloniousfilms.com/">HOME</a></span>

                <div class="entry">

                    <div class="video-js-box">
        <!-- Using the Video for Everybody Embed Code http://camendesign.com/code/video_for_everybody --><br />
        <video id="vid" class="video-js" width="640" height="360" preload autoplay poster="http://www.theloniousfilms.com/wp-content/uploads/2011/03/poster.jpg"><br />
          <source src="http://d29zgp48wvs9kv.cloudfront.net/orkin.m4v" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /><br />

          <source src="http://d29zgp48wvs9kv.cloudfront.net/orkin.ogv" type='video/ogg; codecs="theora, vorbis"' /><br />
          <!-- Flash Fallback. Use any flash video player here. Make sure to keep the vjs-flash-fallback class. --><br />
          <object class="vjs-flash-fallback" width="640" height="360" type="application/x-shockwave-flash"<br />
            data="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf"><param name="movie" value="http://releases.flowplayer.org/swf/flowplayer-3.2.1.swf" /><param name="allowfullscreen" value="true" /><param name="flashvars" value='config={"playlist":["http://www.theloniousfilms.com/wp-content/uploads/2011/03/poster.jpg", {"url": "http://d29zgp48wvs9kv.cloudfront.net/orkin.m4v","autoPlay":true,"autoBuffering":true}]}' /><!-- Image Fallback. Typically the same as the poster image. --><br />
          </object><br />
        </video>
      </div>

Looks like the HTML is being rewritten by 看起来HTML正在被重写

$( "#post-" + cur_numb ).html( content );

Change 更改

$(".video-js").bind('ended', function(){

to

$(".video-js").live('ended', function(){

that should take care of it. 应该照顾它。

Also, change 另外,改变

$( "#post-" + cur_numb ).html( content );

with

$( "#post-" + cur_numb ).replaceWith( content );

我最后只是将所有发布网址拉到一个数组中,然后遍历它们中的每个,一旦上一个视频播放完毕,就移到数组中的下一个项目。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM