Question

我的表在每一行都使用相同的ID构建，带有foreach循环。要查找<p class="comment"中的文本 - 我必须指定在哪里（我想找到最近的文本）

我的表格如下：

        <c:forEach items="${items}" var="item">
        <div class="container theme-showcase" role="main">
            <div class="row">
                <div class="col-md-6">
                    <table class="table fixed">
                        <tbody id="extend">
                            <tr data-toggle="collapse123" class="clickableRow" nowrap="true" data-target=".demo${item.id}" id="${item.id}">
                                <td class="AMLLeft" nowrap="true">
                                    <label for="important"style="display: inline !important">ID:</label>
                                    <p class="important"style="display: inline !important">${item.id}</p>
                                </td>
                                <td align="right" class="AMLRight">
                                    <pre class="thepre">Transaction sum: ${item.sum} ${item.currencyCode}</pre>
                                </td>
                            </tr>
                            <tr class="hiddenRow">
                                <td align="left">
                                    <div class="collapse123 demo${item.id}"><p>AML ID: ${item.id}</p></div>
                                </td>
                                <td align="right" nowrap="false">
                                    <div class="collapse123 demo${item.id}"><input type="button" value="Comment" class="btn btn-xs btn-primary commentButton" <a href="#myModal" data-toggle="modal" id="${item.id}" data-target="#edit-modal"></div>
                                </td>
                            </tr>
                            <tr class="hiddenRow">
                                <td align="left">
                                    <div class="collapse123 demo${item.id}"><p>AML Category: ${item.amlClientCategory}</p></div>
                                </td>
                                <td align="right">
                                    <div class="collapse123 demo${item.id}"><input type="button" value="Close" class="btn btn-xs btn-primary closeButton"></div>
                                </td>
                            </tr>
                            <tr class="hiddenRow">
                                <td align="left">
                                    <div class="collapse123 demo${item.id}"><p>Client ID: ${item.clientId}</p></div>
                                </td>
                                <td align="right">
                                    <div class="collapse123 demo${item.id}"><input type="button" value="Set Investigate" class="btn btn-xs btn-primary investigateButton"></div>
                                </td>
                            </tr>
                            <tr class="hiddenRow">
                                <td align="left">
                                    <div class="collapse123 demo${item.id}"><p class="status">Status: ${item.status}</p></div>
                                </td>
                                <td align="right">
                                    <div class="collapse123 demo${item.id}"></div>
                                </td>
                            </tr>
                            <tr class="hiddenRow">
                                <td align="left">
                                    <div class="collapse123 demo${item.id}"><p class="comment">Comment: ${item.comment}</p></div>
                                </td>
                                <td align="right">
                                    <div class="collapse123 demo${item.id}"></div>
                                </td>
                            </tr>
                            <tr class="hiddenRow">
                                <td align="left">
                                    <div class="collapse123 demo${item.id}"><p>Transaction sum: ${item.sum} ${item.currencyCode}</p></div>
                                </td>
                                <td align="right">
                                    <div class="collapse123 demo${item.id}"></div>
                                </td>
                            </tr>
                    </table>

                </div>
            </div>
        </div>
    </c:forEach>

我想查找<p class="comment">${item.comment}</p>的文字，但这一次是在<div>内。我不知道该怎么做但这是我到目前为止尝试的代码：

var commentValue = $(this).closest('tr.hiddenRow').siblings().find('p.comment').text();

非常感谢任何帮助！

我知道我发布了一个类似的问题here，但这是不同的，因为它在<div>内，我无法帮助自己。

Answer 1

为了节省浏览评论的人，最终的解决方案是： https://jsfiddle.net/5nL1e31z/3

我相信这可以达到你想要的效果，而且我试图将其分解，以便明确发生了什么：https://jsfiddle.net/5nL1e31z/如果不太正确，请告诉我，我可以更新它。 / p>

$('.test-button').click(function () {

    var parentRow = $(this).parent().parent();
    $(parentRow).css('background-color', 'red');

    var hiddenRow = $(parentRow).siblings('.hiddenRow');
    $(hiddenRow).css('background-color', 'yellow');

    var commentTextP = $(hiddenRow).find('.comment');
    console.log(commentTextP.text());
});

Answer 2

build.sbt

http://jsfiddle.net/ux0a3zsx/

因为var commentvalue = $(this).parent().find('p').text();是button引用的内容而this不在其中

Answer 3

你试过这个吗？

var text= $(this).closest('.hiddenRow').find('.comment');

在div HTML / Jquery中查找<p>最近行的文本

3 个答案: