Question

我有一个jquery数据表，在该数据表中，每一行都有一列，可以让您查看该行的详细信息。我不需要datatables row_details的东西。

这个想法是，一旦点击“视图”，文本就会变为隐藏，而行_ ###的div会附加到内容正文。然后，如果在显示该行时单击相同的按钮，则会隐藏它。另外，如果有人点击另一行的视图，则前一行文本应更改为隐藏，隐藏div，并且应显示刚刚单击的那行。

这是我到目前为止所做的：

$("a[class^=view]").click(function() {
    var id = $(this).attr('class').match(/\d{1,}/);

    if( $("div[id^=report_]").size() >= 1) {
     // Slide up, remove
             // Change text back to view    
    } else {
             // Append and change text to Hide
            }
});

如果我在显示一个详细信息时单击另一个'视图'，它会在当前div中添加一个新div并将相同的新div添加到内容正文中..显然不是我正在寻找的效果所以某处我的逻辑错了。有什么想法吗？

Answer 1

知道了。有点乱，但它的工作原理。有兴趣，如果有另一种方式。这是解决方案：

$("a[class^=view]").click(function() {
    var id = $(this).attr('class').match(/\d+/);

    if($(this).text() == "Hide") {
        $(this).text("View");
        $("#report").html(null);
    } else {
        $("a[class^=view_]").each(function(){$(this).text("View");});
        $(this).text("Hide");
        $("#report").html("<div id='report_"+id+"'>viewing report "+id+"</div>").slideDown();
    }
});

Answer 2

要知道元素是否已经存在，我在父元素上使用jquery的find，寻找他的孩子......就像这样：

if($('#parent_container').find('#child_element').length>0){
     //element(s) exists
}else{
     //element(s) not found
}

除非div已存在，否则jquery执行操作，然后替换

2 个答案: