javascript - 使用 custdata 加载 div

Question

我正在加载一个 tr onclick 第一个 tr 但问题是 tr 中的每个 td 应该加载第二个 div 内的不同 div。现在正在加载 custdata 中的内容，但是如何加载相应 div 中的内容？

这是演示 http://jsfiddle.net/FMnTa/6/

Answer 1

我不确定这是否是您要求的，但似乎是这样。

$(function(){
    $(".info").find("img").click(function(){                
        var trid = $(this).parent().attr("idcust");                
        var trdata = $(this).parent().attr("custdata");
        // Hide all content divs and show only the one related to the click
        $("#"+trid).children().hide();
        $(trdata).show();
        $("#"+trid).css("display","block");
    });
});​

这也是一个小提琴：http: //jsfiddle.net/FMnTa/9/

代码也可以像这样进行一些改进：

$(function(){
    $("img", ".info").click(function(){                
        var parent = $(this).parent();
        var trid = parent.attr("idcust");                
        var trdata = parent.attr("custdata");
        // Hide all content divs and show only the one related to the click
        $("#"+trid).show().children().hide();
        $(trdata).show();
    });
});​

自定义数据属性

使用自定义属性时，您应该真正考虑使用自定义数据属性（data-属性）。在您的情况下，属性将是data-idcustand data-custdata。

然后，您可以使用 jQuery.data()获取/设置属性。鉴于您命名属性data-idcust，您可以读取它.data("custid")并使用.data("custid", "newValue").

Answer 2

看看会发生什么：

   $(".info").find("img").click(function(){                
        var trid = $(this).parent().attr("idcust");                
        var trdata = $(this).parent().attr("custdata");
        $("#"+trid).show().find(trdata).css('border', '1px solid red');
        $("#"+trid).show().find(trdata).toggle();
    });

find(trdata)找到tr1 div与id trdata