2

好的，我一直在尝试使用 jquery .closest() 函数。我做了一些研究，但一定是一些我无法弄清楚的逻辑，这让我发疯了。所以这里是代码，请帮忙。

<div class="tablecontainer">

mvcpartial 与

<div class="emptycontainer"><p>no data in table</p></div>
<div class="populatedcontainer"><table><thead><tr></tr></thead>
    <tbody>
        <tr>
            <td><a onclick="deleteRow(this, @Model.ID)"></td>
        </tr>
    </tbody>
</table>
</div>

端部 

</div>

deleteRow 函数接受参数（即 id）。我可以删除该行，但我遇到的问题是淡出 div.populatedcontainer 并在表格为空时淡入 div.emptycontainer。我试过了

var $table = $(that).closest('div.tablecontainer');
$('div.populatedcontainer', $table).fadeOut('slow');
$('div.emptycontainer', $table).fadeIn('slow');

我尝试测试选择器是否能够找到 div.tablecontainer

if ($table.length > 0) {
    console.log("located tablecontainer");
}

但这在调试期间没有出现在控制台中。如果重要的话，页面上有多组 div.tablecontainer。

我试过 var table; （没有 $）。

我试过 var $that = $(that);

我尝试将它放在“如果表为空逻辑”之外，但它仍然不起作用

编辑：根据 Felix Kling 的要求

tr 有一个链接，点击时会调用以下函数

onclick="deleteRow(this, @Model.ID)

并且该函数采用类似的参数

function deleteRow(that, id){
   tried to do stuff like find the right div and fadeIn/fadeOut here (example attempts above)
}

感谢所有的答案。尤其是那些有替代方法的看起来很有希望。我将不得不尝试看看明天哪些工作并更新这篇文章。

4

3 回答 3

1

jsFiddle Demo

如果您的所有结构都相似，那么您可以使用 prev。

var $table = $(that).parents('.populatedcontainer:first');
$table.fadeOut('slow').prev('.emptycontainer:first').fadeIn('slow');
于 2013-06-25T23:00:39.620 回答
0

好吧，不使用最接近但父母

var $table = $(that).parents('div.tablecontainer').eq(0);
$table.find('div.populatedcontainer').fadeOut('slow');
$table.find('div.emptycontainer').fadeIn('slow');
于 2013-06-25T23:04:37.783 回答
0

此方法不使用 .closest() 但可以帮助您完成任务。假设您已将元素存储在名为“that”的变量中，您需要执行以下操作：

$(that).parent(".populatedContainer").siblings().fadeIn();
$(that).parent(".populatedContainer").fadeOut();
于 2013-06-25T23:09:04.430 回答