为什么这个 JavaScript 参数会丢失？

Question

在这个函数中，值参数被向下传递以填写我的 URL。这非常有效。

function showResults(results) {
  var html = '';
  $.each(results, function(index,value) {
    html += '<li><a href="https://www.youtube.com/watch?v=' +     value.id.videoId + '" class="html5lightbox"><img src="' +     value.snippet.thumbnails.medium.url + '">' + value.snippet.title +    '(</a>More from <a href="https://www.youtube.com/channel/' +     value.snippet.channelId + '">' + value.snippet.channelTitle + '</a>)</li>';
  });
  $('#results').html(html);
}

在这个几乎相同的函数中，值参数失去了它的价值。我看不出怎么做。很难调试为什么会发生这种情况，因为无论我检查什么，console.log() 都只会返回“ReferenceError: $ is not defined”（它也在第一部分返回，效果很好）。

function showResults(results) {
  var html = '';
  $.each(results, function(index,value) {
    html += '<li><a href="#"><img src="' + value.snippet.thumbnails.medium.url +  '">' + value.snippet.title + '</a>) </li>';
  });
  $('#results').html(html);

  $('#results li a').click(function(){
    playVid($(this).attr(value.id.videoId));
  });
}

function playVid(vidID) {
  var embedVid = 'https://www.youtube.com/embed/'+vidID+'?autoplay=1';
  document.getElementById('player').src = embedVid;
}

在这里，我尝试将值参数（再次在 url 中）推送到 id="player" 的 iframe。 iframe 接收到无效的参数，视频将无法播放。同时，视频在第一个示例中播放。价值在哪里流失？

Answer 1

value 只存在于each 循环的范围内。因此，首先修复您的参考错误，然后我建议在第二个示例中进行以下更改：

1) 在each 循环中使用videoId 值更新href，如第一个示例所示：

<a href="https://www.youtube.com/watch?v=' + value.id.videoId + '">

2) 然后使用该值启动播放器：

$('#results li a').click(function(e) {
  e.preventDefault();
  playVid($(this).attr('href'));
});