Question

我有一个像这样的<td>元素：

<td class="right editable qty">100</td>

我希望得到（100）里面的值，但是遇到了一些问题。

这是我的剧本：

$('#example tbody tr td.qty').change(function () {
    var sQty = $(this);

    console.log(sQty); // print [<td class="right editable qty">100</td>]
    console.log($.text(sQty)); // print nothing
    console.log(sQty.val()); // print nothing
    console.log(sQty.text()); // print nothing
    console.log(sQty.html()); // print <form><input style="width: 100%; height: 100%; " autocomplete="off" name="value"></form>
});

我的剧本是否缺少某些内容？

我正在使用：DataTables和jeditable

Answer 1

您可以使用$(selector).text();

获取值

更改

console.log($.text(sQty));

到

console.log(sQty.text());

Answer 2

提示：来自.change文档

更改事件在其值更改时发送给元素。这个事件仅限于元素，盒子和元素。对于选择框，复选框和单选按钮。

所以请使用.text()

获取文字

console.log($('#example td.qty').text());

Answer 3

我写这个以防有人发现这个问题

尝试选择各种<td>时，为了获取（或设置）多个<td>标记中的每个值，如下所示：

<td class='myClass'>1</td>
<td class='myClass'>2</td>
<td class='myClass'>3</td>

如果您使用.text()，.val()或.html()，则如下所示：

//Example
var tdContainer;
for (int k = 0; k < $("td.myClass").length; k++){
     var tdContainer = $("td.myClass")[k].text() + ", "; //Throws "Uncaught TypeError"
}

Javascript抛出错误，返回＆＃34; [used method]不是函数＆＃34;。

在这种情况下，解决方案将使用.textContent：

//Example
var tdContainer;
for (int k = 0; k < $("td.myClass").length; k++){
     tdContainer += $("td.myClass")[k].textContext + ", ";
}

希望这有助于你们中的一些人。

Answer 4

首先td没有change属性使用click而是

$('#example tbody tr td.qty').click(function () {
    var sQty = $(this);

    console.log(sQty.html()); // print [<td class="right editable qty">100</td>]
    console.log(sQty.text()); // print 100
    console.log(sQty.val()); // nothing will print,val() is for input type elements
});

Answer 5

hiii朋友，

您只需通过选择具有类名（.righteditableqty）的列，然后使用.text（）函数选择文本，即可从表行的表列中获取值。

或使用该脚本：

的 $(".righteditableqty").Text() 的

Answer 6

/* Apply the jEditable handlers to the table */
oTable.$('td.editable').editable(
    function(value, settings) {
        if($(this).hasClass('qty')) // The editable class not only on one column.
            console.log(value);
        return(value);
    },
    {   
        "height": "100%",
        "width": "100%"
    }
);

当我尝试运行jEditable处理程序和change事件时（上面有问题），我发现change事件将首先触发，然后jEditable事件触发jEditable事件1}}处理程序。 value处理程序将执行的操作是返回<td class="right editable qty">1</td>并设置为已编辑的单元格。

默认情况下，表格单元格如下所示：

<td class="rigth editable qty"> <form> <input style="width: 100%; height: 100%; " autocomplete="off" name="value"> </form> </td>

当我点击单元格时，它将生成此表单：

input

正如我们所看到的那样，单元格的值消失了（这是我在尝试使用firebug检查元素时得到的形式）。当我尝试更改form内的Enter元素的值时，firebug根本没有显示任何变化（值隐藏在某处）。因此，当我按下change按钮时，我意识到<td>事件将首先触发，此时change元素仍为空，这就是为什么当我们尝试打印该值时还是空的。

因此，我没有使用jEditable事件来获取值，而是在将值返回到单元格之前使用Enter处理程序（如果我们按下{{，则会触发处理程序1}}按钮）。

使用jQuery无法获取文本内容

6 个答案: