jQuery在获得特定输入时衰减单元格

我得到了一个带有一些单元格的输入和表格。我是jQuery的新手，而谷歌叔叔无法解决我的问题，所以你可以这样做：

<input type='text' id='myinput' value='' />
<table class="main">
    <tr>
        <td id="cells">Some cells</td>
    </tr>
</table>

它可以工作，但我必须在字段上单击两次-当键入匹配的单词时，第一次单击列表，第二次单击字段时淡出单元格。。。我想在第一次点击后立即淡出。如何改进代码？

尝试以下方法：（这就是您想要实现的目标）：

在这里演奏小提琴：

$('#myinput').focus(function() {
   if( $(this).val() == "dog") {
      $('#cells').animate({'opacity':'0.2'},1000, function() {
        $('#myinput').val('').css('opacity','1');
      });
   }
});

$('#myinput').change(function() {
   if( $(this).val() == "dog") {
      $('#cells').animate({'opacity':'0.2'},1000, function() {
        $('#myinput').val('').focus();
         $('#cells').css('opacity','1');
      });
   }
});