jquery - 如何从类名读取值

我有下表

<table>
    <thead>
        <tr>
            <th class="tTle">Mon</td>
            <th class="tTle">Tues</td>
            <th class="tTle">Wed</td>
        <tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="monday"/>
            </td>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="tuesday"/>
            </td>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="wednesday"/>
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="monday"/>
            </td>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="tuesday"/>
            </td>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="wednesday"/>
            </td>
        </tr>
        <tr>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="monday"/>
            </td>>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="tuesday"/>
            </td>
            <td>
                <input type="text" class = "Val1"/>
                <input type="text" class = "Val2"/>
                <input type="button" class = "but" val="wednesday"/>
            </td>
        </tr>
    </tbody>
</table>

我想在单击时读取tTle的相应thead值，但？我怎样才能做到这一点？

    $(function ()
    {

         $(".but").click(readTitle);


        });
});

最佳答案

如果我很好理解，如果单击一个按钮，则要获取此按钮位于哪一列，并确定该列的thead标题。我的小片段做到了：

$('.but').click(function () {
  var $me=$(this);
  var place=$('td', $me.closest('tr')).index($me.closest('td'));

  var text=$('thead .tTle').eq(place).text();
});

在place中，将存储按钮的父td从0开始的位置。这可以使用.index()来获取，它在相应的td中的tr集合上执行，并获取我们的td在其中的位置。

有了索引后，使用.tTle可以轻松找到我们要查找的.eq()。

编辑：和答应的jsFiddle。尽管OP在此答案下方的注释中指出必须对其进行更改，但似乎工作正常。可能是一些标记问题。