Question

我遇到了一些与textarea控件的keyup事件绑定的问题。我正在尝试下面的

var shortDescInput = $('nobr:contains("Short Description")').closest('tr').find($('textarea[title="Short Description"]'));

    // this doesn't work
    shortDescInput.bind('keyup', function () {
        countShortDescChars();
    });

    // Nor this
    shortDescInput.keyup(function () {
        countShortDescChars();
    });

我错过了一些非常明显的东西吗？这适用于其他控件，例如将事件绑定到radiobutton。我已经检查了，我正在挑选正确的textarea

var shortDescInput = $('nobr:contains("Short Description")').closest('tr').find($('textarea[title="Short Description"]'));

我似乎从来没有得到过keyup事件......

Answer 1

find($('textarea[title="Short Description"]'))非常低效。出于您的目的，find应该选择一个选择器作为其参数。

当您将jQuery对象传递给find时，jQuery首先从顶部查询DOM并找到与该选择器匹配的所有元素。然后，find循环遍历所有这些结果，直到找到与指定父项匹配的结果。

您应该使用：

find('textarea[title="Short Description"]')

另外，请使用.on代替.bind。由于效率低下，.bind将在以后的版本中弃用。

shortDescInput.on("keyup", countShortDescChars);

修改后的代码：

$(function () {
    var shortDescInput = $('nobr:contains("Short Description")').closest('tr').find('textarea[title="Short Description"]');

    shortDescInput.on("keyup", countShortDescChars);
});

Answer 2

使用console.log（）或旧式alert（）验证选择器是否正在使用.length ：

var shortDescInput = $('nobr:contains("Short Description")').closest('tr').find('textarea[title="Short Description"]');

alert(shortDescInput.length);

您也可以一步一步地确定不返回任何内容的人：

alert($('nobr:contains("Short Description")').length);
alert($('nobr:contains("Short Description")').closest('tr').length);
alert($('nobr:contains("Short Description")').closest('tr').find('textarea[title="Short Description"]').length);

第二次尝试。 使用.on（）代替.bind（）：

shortDescInput.on('keyup',function(){countShortDescChars();});

Answer 3

所以我和你的小提琴一起玩...... 您的选择器出现了问题。

首先，我从js部分删除脚本标记。
然后删除你的HTML中的脚本标记，因为它打破了小提琴。
切换到jQuery 1.8.0，因为MooTools不是我们想要的。
在您的巨型选择器之后添加shortDescInput = $('textarea');，事件被触发！
在您的函数中再次添加shortDescInput = $('textarea');以使计数器正常工作。

再说一遍，我们现在试着弄清楚为什么你的选择器不能正常工作： - ）

修改

发现它！

我用.parent（）替换你的.closest（）。next（）因为我认为.closest（）是针对父母的。

var shortDescInput = $('nobr:contains("Short Description")').parent().next().find('textarea[title="Short Description"]');

Answer 4

问题是，至少在小提琴中，<tr>不在<table>中，因此浏览器将其从DOM中删除。将<tr>包裹在<table>中会使小提琴奏效演示：http://jsfiddle.net/kNkXE/9/

Jquery绑定到keyup

4 个答案: