javascript - 使用 jquery 启用禁用动态元素

Question

我正在使用 jquery 来启用禁用输入元素。但我可以对具有相同类的相似元素执行操作

html代码:

<script src="//ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>        
<table>
 <tr>               
     <td>
        <input type="text" value="1" class="price" disabled></input>     <input type="button" class="enable" value="Edit"/>
     </td>
     <td>
        <input type="text" value="1" class="price" disabled></input>  <input type="button" class="enable" value="Edit"/>
     </td>
     <td>
        <input type="text" value="1" class="price" disabled></input>  <input type="button" class="enable" value="Edit"/>
     </td>
 </tr>
</table>

jquery 代码:

$(function(){
$('.enable',this).click(function(){
  $('.price').prop('disabled',false);  
  $('.enable').prop('value','save');  
});
});

要么适用于所有盒子，要么不起作用

fiddle

Answer 1

在处理程序本身中正确使用this

$(function(){
$('.enable').click(function(){
  $(this).prev('.price').prop('disabled',false);  
  $(this).prop('value','save');  
});
});