Question

我有一个带有一个视频的flexslider。代码是这样的： -

HTML：

if(count($bannerlist)>0)
{
  $v = 0;
  foreach($bannerlist as $key=>$row)
  {
    if($row['Banner']['media_type'] == 'i')
    {
    ?>
    <li>
      <img src="<?php echo $this->webroot.$row['Banner']['image_name']; ?>" />
      <div class="flexCaption">
        <div class="container">
          <div class="col-md-6 pull-right">
            <div class="valiGn">
              <h2><?php echo $row['Banner']['title'];?></h2>
              <!--<h3>Assurance</h3>-->
              <p><?php echo $row['Banner']['description'];?></p>
              <!--<a class="linkView" href="#">View Details</a>-->
            </div>
          </div>
        </div>
      </div>
    </li>
    <?php
    }
    else if($row['Banner']['media_type'] == 'v')
    {
      $v++;?>
      <li id="slide<?php echo $v;?>">
        <video id="myVideo<?php echo $v;?>" class="classFlexVideo" autoplay loop>
           <source src="<?php echo $this->webroot.$row['Banner']['image_name'];?>" type="video/mp4">
           <!--<source src="<?php echo $this->webroot?>images/Balasore.webm" type="video/webm; codecs=vp8, vorbis">-->
       </video>
       <img src="<?php echo $this->webroot?>images/bg3.jpg" />
        <div class="flexCaption">
          <div class="container">
            <div class="col-md-6 pull-right">
              <div class="valiGn">
                <h2><?php echo $row['Banner']['title'];?></h2>
                <p><?php echo $row['Banner']['description'];?></p>
              </div>
            </div>
          </div>
        </div>
      </li>
      <?php
    }
  }
}

的Javascript / Jquery的： -

$('.flexslider').flexslider({
   animation: "slide",
   direction: "vertical",
   animationLoop: false,
   directionNav: false,
   video: true,
   slideshow: false,
   manualControls: ".flex-control-nav li",
   itemMargin: 10,
   start:function(){
     /*myVideo1.play();*/
   },
   before: function(){
      $('video').get(0).pause();
   }           
});

$('#vidPlay1').click(function(){ // click on first dots to play video
   myVideo1.play();
});

我从数据库中获取图像/视频，因此可能有多个视频。在这种情况下，视频对象的ID可能类似于 myVideo1 ， myVideo2 ， myVideo3 ，....等等。我需要编写myVideo1.play()，myVideo2.play()等代码

在PHP中，我们可以创建像

这样的动态变量

$var = 'myHouse';
$$var then denotes $myHouse.

javascript中有类似的东西吗？比如说，

var videoVar = eval('myVideo' + i);
videoVar.play();

Answer 1

按ID访问元素的首选方法是使用document.getElementById，这是您可以执行的操作：

var video = document.getElementById('myVideo' + i)
video.play()

如何通过在Javascript末尾附加一个值来创建动态对象？

1 个答案: