如何从相同内容中检索数据并将数据输出到外部div

时间:2014-01-08 01:14:23

标签: javascript jquery

我有一个由3列组成的数据表。在第三列是一个单击按钮,它应该将数据添加到外部div,其id为routeList,来自第二列中的第一个p。这是我的HTML。我还添加了一个click事件来更改按钮的类并更改按钮文本。

html的

<tr>
    <td class="col1"><img src="http://placehold.it/200x200" alt="..." class="img-responsive tableImage"></td>
    <td class="col2">
        <p class="address">
            <i class="fa fa-home fa-lg"></i> Address
        </p>
        <p>
            <i class="fa fa-calendar fa-lg"></i> Dates
        </p>
        <p>
            <i class="fa fa-map-marker fa-lg"></i> Distance
        </p>
    </td>
    <td class="col3">
        <button type="button" class="btn btn-sm routeAdd btn-success" data-toggle="addToRoute"><i class="fa fa-check"></i> Added</button>
    </td>
</tr>

的.js

$('[data-toggle=addToRoute]').click(function() {
    if($(this).children().hasClass('fa-plus')) {
        $(this).removeClass('btn-custom').addClass('btn-success').empty().html('<i class="fa fa-check"></i> Added');
            } else {
        $(this).removeClass('btn-success').addClass('btn-custom').empty().html('<i class="fa fa-plus"></i> Add');
            }
        });

我试图将其添加到if语句的第一部分

$(this).closest('p.address').appendTo('#routeList');

我想我错过了一些简单的事情。在else语句的另一面,如果单击按钮,则应删除p。我没有正确选择元素。或者我正在攻击这个完全错误。

1 个答案:

答案 0 :(得分:1)

尝试

$(this).closest('tr').find('p.address').appendTo('#routeList');

在最近的p.address找到tr

.find()