0

我有一个video objects以 HTML 呈现 的列表

   <div class="video">
        <p class='title'> {{ video.title }} </p>
        <p class='url'> {{ video.url }} </p> 
        <button class="btn btn-primary queue" href="#">queue</button>
    </div>
    <br />

我想要的是？

每当我点击任何视频列表时，都应该选择标题和网址

我有jQuery一个 

$(function(){
    $('body').on('click', '.video', function(event) {
        var title = $(this).closest('.title');
        console.log(title);
        alert(title);
    });
});

当我在萤火虫中看到时，console.log(title)就像jQuery( )在萤火虫中一样，我做错了什么？

4

3 回答 3

2

.closest('.title')将向上 DOM 层次结构，直到找到与选择器匹配的元素。然后它将为该选择器返回一个 jQuery 对象。

您想要做的是向下遍历 DOM 层次结构，例如使用children方法（搜索直接子项）或find方法（搜索子项的子项），然后使用文本或其 HTML 内容检索其文本使用html 方法（而不是获取 jQuery 对象）：

var title = $(this).children('.title').text();
于 2012-08-16T22:26:39.837 回答
2

.closest()上升到父链。如果要搜索子对象，请使用.find(). 您的代码还使它看起来像您想要 div 的内容，而不是 jQuery 对象。结合这些变化，你会得到：

$(function(){
    $('body').on('click', '.video', function(event) {
        var title = $(this).find('.title').html();
        console.log(title);
        alert(title);
    });
});
于 2012-08-16T22:23:23.413 回答
2 
$(function(){
  $('body').on('click', '.video', function(event) {
    var title = $(this).find('.title').html();
    console.log(title);
    alert(title);
  });
});​
于 2012-08-16T22:24:40.543 回答