Question

我有

<table class="prodtable">
<tr>
 <td></td>
 <td>
     <input class="editok" value="2" />
 </td>
 <td>
  <input name="prodnumber" value="1" />
  <i></i>
 </td>
</tr>
</table>

和这个js

$('.prodtable').on('blur','.editok',function(){
   var neuanzahl = $(this).val();
   $(this).parent('td').text(neuanzahl);//<-- till here works fine
   $(this).parent('td').next().find('input').val(neuanzahl);//<-- from here, failure
   $(this).parent('td').next().find('i').addClass('icon-pencil'); 
});

动态插入editok输入，这就是我从父表设置处理程序的原因。

我的问题是，在模糊事件中，给定输入的值应放在下一个输入中，该输入位于名称为td的下一个prodnumger内，<i>应该得到班级icon-pencil。

我现在尝试了1个小时，真可惜......没有一次成功。我在这做错了什么？

Answer 1

这一行

$(this).parent('td').text(neuanzahl);

替换了TD中的所有内容，因为它是text()所做的，它会覆盖所有内容，所以当你执行下一行时

$(this).parent('td').next().find('input') ...

没有this，您刚刚使用text()

将其删除

只是链接而不是使用多行将保留引用

$('.prodtable').on('blur','.editok',function(){
   var neuanzahl = this.value;

   $(this).parent('td')
          .text(neuanzahl)
          .next('td')
          .find('input')
          .val(neuanzahl)
          .next('i')
          .addClass('icon-pencil'); 
});

FIDDLE

Answer 2

您致电$(this).parent('td').text(...)的那一刻，您已从其父级中移除了input。因此，以下调用中的$(this).parent('td')无法匹配任何内容。

在开始时保存td，并在整个过程中使用它：

$('.prodtable').on('blur','.editok',function(){
   var neuanzahl = $(this).val();
   var td = $(this).parent('td');

   td.text(neuanzahl);
   td.next().find('input').val(neuanzahl);
   td.next().find('i').addClass('icon-pencil'); 
});

示例：http://codepen.io/paulroub/pen/xHwdi

Answer 3

Solution用于存储变量中下一个div的引用。

$('.prodtable').on('blur', '.editok', function () {
    var td =  $(this).parent('td'); 
    var next =  $(this).parent('td').next(); //Store reference of next div in a variable
    var neuanzahl = $(this).val();
    td.text(neuanzahl); 
    next.find('input').val(neuanzahl);
    next.find('i').addClass('icon-pencil');
});

您的代码存在问题，因为当您将内容替换为$(this).parent('td').text(neuanzahl)时，this对td的引用会丢失。

Answer 4

您的桌子开口标签拼写不正确，这可能是您遇到困难的原因。

Jquery next（）不起作用

4 个答案: