jqueryのドロップダウンから値を選択して、divのどのボタンのテキストを変更するかを知るには？

Question

<tr> 
    <td>gggg</td> 
    <td>343434343</td> 
    <td>gg ggg</td> 
    <td> 
     <select id="purchase" data-id="<?php echo $arr['cusid']; ?>" 
      class="items" name="items"> 
      <option value="1" 
       <?php if($arr['itemstatus']=="Item Picked") echo 'selected="selected"'; ?>> 
       Item Picked 
      </option> 
     </select> 
     <button class="issue modify btn btn-success" id="ref" 
      data-id="<?php echo $arr['cusid']; ?>"> 
      <?php if($arr['issuestatus']=="0") {echo 'Not Issued';} else{ echo 'Issued'; } ?> 
     </button> 
    </td> 
</tr> 

私のhtmlテーブルには、このようなコードがあります。私はこのように多くの行を持っています。選択ボックスから選択したアイテムを選択しているときに、選択ボックスの内容を変更しているときにクラス発行のボタンタグに発行されたテキストを表示するとします。コードを書きましたが、最初の行で選択ボックスの値を選択すると、発行されたテキストに、クラスの問題を含むすべてのボタンが他のすべての行に表示されます。特定のボタンにテキストの問題を表示したい。私が書いたコードを以下に示します：

<script type="text/javascript"> 


$(function() { 


$('select.items').on('change', function(e) { 


      var text = 'Issued'; 

      $("button#ref:last").html(text); 


      var cusid = $('.items').attr("data-id"); 



    }); 

    }); 


</script> 

誰でも私を助けてくれますか？

Answer 1

イベントハンドラ内でthisオブジェクトを使用して、適切な要素をトラバースして選択する必要があります。ボタンはselect要素にすぐに次の兄弟であるので、ここで私は

$('select.items').on('change', function(e) { 
    var text = 'Issued'; 
    var cusid = $(this).data("id"); 

    $(this).next(".btn.issue").text(text); 
}); 

はまた、あなたのHTMLが無効になるだろう、複数のIDを使用して、 .next()を使用していました。ボタンに同じid "ref"を使用する代わりに、クラスを使用します。