Question

我有这样的标记

    <table class="processed">
        <tr class="translated">
            <td class="meta-data">Subscription </td>
            <td class="test_staus">Lorem</td>
            <td class="total_price"><input type="text" value="3"></td>
        </tr>
        <tr class="proofreaded">
            <td class="meta-data">Subscription </td>
            <td class="test_staus">Lorem</td>
            <td class="total_price"><input type="text" value="7"></td>
        </tr>   
</table>

如您所见，我在两行中都有两个输入字段。所以我希望当我开始输入一个输入文本框时，它会在其父类中添加一个类。为此，我让我的js像这样

<script>
        jQuery(document).ready(function($) {
          jQuery('body').keyup('td.total_price input',function() {
           var Selected = jQuery(this).closest('tr');
          Selected.addClass('selected');
       });
    });
    </script>

但它根本不起作用。你可以看到，小提琴链接是here。那么有人可以告诉我如何添加一个类只是所选的父类。任何帮助和建议都会非常明显。感谢

Answer 1

事件绑定中存在语法错误，请使用：

jQuery('body').on('keyup', 'td.total_price input',function() {

如果页面上有静态元素，则无需使用上述委托事件。您可以像其他答案中建议的那样简单地使用直接事件绑定：

 jQuery('td.total_price input').on('keyup', function() {

Answer 2

您的事件语法不正确。这很好用：

jQuery(document).ready(function ($) {
    jQuery('td.total_price input').keyup(function () {
        jQuery(this).closest('tr').addClass('selected');
    });
});

<强> jsFiddle example

Answer 3

请改为尝试：

   jQuery(document).on('keyup', 'td.total_price input', function() {
        var Selected = jQuery(this).closest('tr');
        Selected.addClass('selected');
   });

或者更好的是，除非在DOM准备好之后添加表格内容：

   jQuery('td.total_price input').keyup(function() {
        var Selected = jQuery(this).closest('tr');
        Selected.addClass('selected');
   });

DEMO

Answer 4

试试这个：

$("input").on("keyup",function(){
    $(this).parent(".total_price").parent("tr").addClass("selected");
});

jQuery向选定的父级添加一个类，不起作用

4 个答案: