Jquery子表ID

时间:2012-10-17 11:17:34

标签: jquery

尝试从表id =“1”中获取表ID  在html / script下面 当点击Account或Bill链接时,我想获取表ID,这样我就可以将该表ID传递给另一个函数来获取AJAX数据。表ID是装箱dyno。这是测试数据

<html>
<head>
<script src="jquery-1.8.2.min.js"></script>
<script type = "text/javascript">
$(document).ready(function() {                  
                $('.toggler').click(function(event){
                    event.preventDefault();
                    $(this).parent().find('.content').slideToggle();
                    var a = $(this).next("div").find(".content").children().attr("id");
                    alert(a);

                }); 
</script>
</head>
<body>
<table border="1">
    <tr>
        <td>
            <table id="MainTable">
                <tr>
                    <td>
                        <div class="toggler-wrap">
                            <a href="#" class="toggler">Account </a>
                            <a href="#" class="toggler">Bill</a>
                            <div class="content">   
                                <table id="1">
                                    <tr><td>Content will come here</td></tr>                                    
                                </table>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td>
            <table id="MainTable">
                <tr>
                    <td>
                        <div class="toggler-wrap">
                            <a href="#" class="toggler">Account</a>
                            <a href="#" class="toggler">Bill</a>
                            <div class="content">   
                                <table id="2">
                                    <tr><td>Content will come here</td></tr>                                    
                                </table>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    </table>
</body>
</html>

3 个答案:

答案 0 :(得分:1)

你可以像这样得到它

$('.content').find('table').attr('id');

更新代码:

 $('.toggler').click(function(event){
      event.preventDefault();
      $(this).parent().find('.content').slideToggle();
      var a = $(this).parent().find(".content").find('table').attr('id');
      alert(a);
 }); 

Updated Jsfiddle

答案 1 :(得分:1)

$('.toggler').click(function(event){
   event.preventDefault();
   $(this).parent().find('.content').slideToggle();
   var a = $(this).parent().find('table').attr("id");
   alert(a);
});

答案 2 :(得分:0)

我会为包含您要搜索的ID的每个链接添加一个属性,然后使用该属性查找您要查找的特定表。

<html>
<head>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script type = "text/javascript">
$(document).ready(function() {                  
                $('.toggler').click(function(event){
                    event.preventDefault();
                    var targetId = $(this).attr('data-id');
                    //Call ajax with the target Id

                    var content = $('table[id="' + targetId + '"] td').text();
                    alert(content);

                    $(this).parent().find('.content').slideToggle();
                }); 
            });
</script>
</head>
<body>
<table border="1">
    <tr>
        <td>
            <table id="MainTable">
                <tr>
                    <td>
                        <div class="toggler-wrap">
                            <a href="#" class="toggler" data-id="1">Account </a>
                            <a href="#" class="toggler" data-id="1">Bill</a>
                            <div class="content">   
                                <table id="1">
                                    <tr><td>Content for id 1</td></tr>                                    
                                </table>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td>
            <table id="MainTable">
                <tr>
                    <td>
                        <div class="toggler-wrap">
                            <a href="#" class="toggler" data-id="2">Account</a>
                            <a href="#" class="toggler" data-id="2">Bill</a>
                            <div class="content">   
                                <table id="2">
                                    <tr><td>Content for id 2</td></tr>                                    
                                </table>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
    </table>
</body>
</html>