Question

我不确定是否存在异常，因为我正在使用Knockout，或者没有，但我似乎无法获得第一列的文本值。

当我单击一行中的某个按钮时，我试图获取与该行关联的第一个单元格文本，不包括标题（只是ID字段）。

这是我的基本HTML。

<table class="table table-bordered table-striped text-center" id="plan_table">
    <thead>
        <tr>
            <th>
                ID
            </th>
            <th>
                Description
            </th>
            <th>
                # of Payouts
            </th>
            <th>
                Edit
            </th>
        </tr>
    </thead>
    <tbody data-bind="foreach: paymentOption">
        <tr>
            <td data-bind="text: Id"></td>
            <td data-bind="text: description"></td>
            <td data-bind="text: paymentQuantity"></td>
            <td>
                <button class="btn btn-default" onclick="reroute()"><i class="glyphicon glyphicon-pencil"></i></button>
            </td>
        </tr>
    </tbody>
</table>

这是我正在尝试的（以及在StackOverflow上找到的任何解决方案）......

function reroute() {
    var name = $(this).closest('tr').find('td:first').text();
    //$(this).closest('tr').children('td:eq(0)').text();
    console.log(name);
}

每次我得到一个空字符串，我不知道为什么。

Answer 1

由于您使用的是onclick属性，因此您应该将this（事件调用方）传递给方法：

<button class="btn btn-default" onclick="reroute(this)"><i class="glyphicon glyphicon-pencil"></i></button>

脚本：

function reroute(el) {
    var name = $(el).closest('tr').find('td:first').text();
    //$(this).closest('tr').children('td:eq(0)').text();
    console.log(name);
}

JSFiddle

如果可能的话，我会unobtrusive

<button class="btn btn-default my-btn"><i class="glyphicon glyphicon-pencil"></i></button>

脚本：

$('.my-btn').click(function(){
    var name = $(this).closest('tr').find('td:first').text();
    //$(this).closest('tr').children('td:eq(0)').text();
    console.log(name);
});

JSFiddle

Answer 2

使用Knockout时，不应该从HTML中抓取数据。您的按钮可以访问行数据（方便地，在$ data中）。

<button class="btn btn-default" onclick="reroute($data.Id)">

应该将您想要的数据传递给您的重新路由功能。

我创造了一个有效的小提琴。有许多细节需要以Knockout方式处理。 http://jsfiddle.net/srndhvv7/1/

Answer 3

试试这个：

function reroute() {
    var name = $(".table").find('td:first-child').text();
    console.log(name);
}

在当前行中查找第一列文本

3 个答案: