无法更改视频属性。如何修复它？

Question

我正在制作一个菜单来改变我的videojs源，它部分起作用了。我可以用$video_obj.src改变我的视频源，但是我不能像nonHD那样改变我的标签，甚至不能改变类样式.vjs-poster。

我忘了什么吗？

​

$("ul.dl-menu a").click(function() {
	
	var $myClass 		=  $(this).attr("class");
	var $target         =  $(this).attr("id");
    var $content_path   = "~path~/media-video/";
	var $thumbs         = "~path~/media-video/thumbs/";

    if ($myClass === "library") {
	    var $vid_obj        = videojs("div_video");
	    var $video_div			= "div_video";
    }
    else {
	    var $vid_obj        = videojs("div_video_awards");
	    var $video_div			= "div_video_awards";
    }

	
      $vid_obj.ready(function() {
      $($video_div+'.poster').hide();
      $($video_div+'_html5_api').hide();
      $vid_obj.pause();
      $($video_div+'video source:nth-child(1)').attr("src",$content_path+'mp4/'+$target+'.mp4');
	  $vid_obj.src({ type: "video/mp4", src: $content_path+'mp4/'+$target+'.mp4' });
      $($video_div+'video').attr("src",$content_path+'mp4/'+$target+'.mp4');
	  $($video_div).attr("nonHD",$content_path+'mp4/'+$target+'.mp4');
      $($video_div).attr("HD",$content_path+'mp4-720p/'+$target+'.mp4');
      $($video_div+'video').attr("HD",$content_path+'mp4-720p/'+$target+'.mp4');
      $($video_div+'video').attr("nonHD",$content_path+'mp4/'+$target+'.mp4');
      $($video_div+'.vjs-poster').attr("style", 'background-image: url('+$thumbs+$target+'.jpg);');
      $($video_div+'.vjs-tech').attr("poster",$thumbs+$target+".jpg").show();
      $($video_div).attr('poster',$thumbs+$target+'.jpg');
      $($video_div).removeClass('vjs-playing').addClass('vjs-paused');
      var css = document.createElement("style");
	  css.type = "text/css";
      css.innerHTML = ".vjs-control.vjs-HD-button { color: silver; font-weight:normal; text-shadow: 0 0 5em #fff;}";
      document.body.appendChild(css);
      HD1 = false;
      $vid_obj.load();

      $($video_div+'_html5_api').show();
      setTimeout(function(){
      $vid_obj.play();
      }, 0);
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<video id="div_video" class="video-js vjs-sublime-skin vjs-big-play-centered" width="auto" height="auto" poster="http://video-js.zencoder.com/oceans-clip.png" HD="http://video-js.zencoder.com/oceans-clip.mp4" nonHD="http://video-js.zencoder.com/oceans-clip.mp4" controls>
<source src="http://video-js.zencoder.com/oceans-clip.mp4" type="video/mp4">
</video>

<div id="dl-menu" class="dl-menuwrapper">
  <button class="dl-trigger">Menu</button>
  <ul class="dl-menu">
    <li><a class="library" href="javascript:;" id="MBHD0790-03">Into the Woods</a></li>
    <li><a class="library" href="javascript:;" id="MBHD0790-04">Kingsman</a></li>
  </ul>
</div>

​

Answer 1

好吧，考虑到这个：

 $($video_div+'video').attr("nonHD",$content_path+'mp4/'+$target+'.mp4');

你会做什么

 $('video_divvideo').attr(....);

由于没有#，所以javascript将在dom中寻找一个像<video_divvideo>这样的标签，这个标签当然不存在。

也许你想

 $('#' +$video_div).attr(...);

而不是？