jquery - 检查div是否为空问题

Question

我想检查 div 是否为空，如果是的话我想向其中添加文本“空”。

我做错了什么？谢谢!

js Fiddle File

HTML

<div class="staff-row">
    <img alt="" src="foo.jpg" />
    <h2>Lorem Ipsum! FOOO!</h2>
    <p>Lorem Ipsum</p>
  </div>
  <!-- eo : staff-row --> 

jQuery

$('.staff-row').mouseenter(function() {
    if ($('.staff-row').is(':empty')) {
        $('.staff-row').text('empty');
    } else {
        $('.staff-row').text('full');
    }
});​

Answer 1

您需要使用$(this)而不是$('.staff-row')，另外确保div打开之间没有空格和结束标记。

<强> Live Demo

$('.staff-row').mouseenter(function() {
    if ($(this).is(':empty')) {
        $(this).text('empty');
    } else {
        $(this).text('full');
    }
});​

如果您想在 div 标签之间留有空格，可以使用 if($.trim($(this).text()).length == 0)

<强> Live Demo

$('.staff-row').mouseenter(function() {
    if($.trim($(this).text()).length == 0){
        $(this).text('empty');
    } else {
        $(this).text('full');
    }
});​