私はHTMLを以下ましたHi

Question

をクリックし、変数idのリンクをjQueryの関数を呼び出しますか？私は、コードの下に書かれたが、その作業をされていない機能していない：

<script type="text/javascript"> 
$(document).ready(function() { 
$(function() 
{ 
    $.getJSON("DsrList.php",{page:"dsrlist",request: 
    "dsrData"},function(json) 
    { 
     var response = json.response; 
     var screen = response.screen; 
     var session = response.session; 
     var branch = session.branch; 
     var username = session.username; 
     var dsrNo = session.dsr_no; 
     var dsrData = session.dsrData; 
     if(screen == "dsrlist"){ 
      $("#dsr-branch").text(branch); 
      $("#dsr-user").text(username); 
      $("#dsr_no").text(dsrNo); 
      $("#dsr-data").html(dsrData); 
     } 
    }); 
}); 

$(function(){ 

$.fn.extend({ 
uploadStatus: function() { 
var id = $(this).attr('id'); 
id = id.replace("upload-", ""); 
    alert(id); 
} 
}); 

$.fn.extend({ 
deleteStatus: function() { 
var id = $(this).attr('id'); 
id = id.replace("delete-", ""); 
    alert(id); 
} 
}); 

$('.action').on('click', function(e) { 
if($(this).hasClass('upload')) { 
    $(this).uploadStatus(); 
} else { 
    $(this).deleteStatus(); 
} 
}); 

}); 
}); 
</script> 

DsrList.phpは、データ次投入されています。$（ "＃1 DSR-データ"）

<tr> 
<td>812210</td> 
<td>03-12-2016</td> 
<td>10</td> 
<td>out for delivery</td> 
<td> 
    <a class="action upload" id="upload-1"> 
    <img src="img/upload.png" alt="Upload"></a> 
    <a class="action delete" id="delete-1"> 
    <img src="img/delete.png" alt="Delete"></a> 
</td> 
</tr> 
<tr> 
<td>812211</td> 
<td>03-12-2016</td> 
<td>20</td> 
<td>out for delivery</td> 
<td> 
    <a class="action upload" id="upload-2"> 
    <img src="img/upload.png" alt="Upload"></a> 
    <a class="action delete" id="delete-2"> 
    <img src="img/delete.png" alt="Delete"></a> 
</td> 
</tr> 

HTML（dsrData ）;を割り当てる。

クリックして画像を更新/削除すると警告が表示されません。

親切に私はこの問題を解決するのに役立ちます。 ありがとうございます。

Answer 1

ちょうどHTMLでonclick属性を使用していないあなたはjQueryの拡張プロパティを使用しているとして、あなたが適切にjQueryの使用を取ることができ、あなたはクラス共通でactionでクラスdeleteとuploadを追加することができます。

あなたのHTMLは次のようにする必要があります：

<a class="action upload" id="upload-1"> 
    <img src="img/upload.png"> 
</a> 
<a class="action delete" id="delete-1"> 
    <img src="img/delete.png"> 
</a> 

と単純には、クリックされたブロックは、アップロードや削除のために知っているためにjQueryのonClickイベントハンドラとhasClassメソッドを使用します。より良く理解するために以下のコードを参照してください。

あなたはこのようにそれを行うことができます。

$(function(){ 
 

 
    $.fn.extend({ 
 
    uploadStatus: function() { 
 
     alert('Upload Block Clicked : id = ' + $(this).attr('id')); 
 
    } 
 
    }); 
 
    
 
    $.fn.extend({ 
 
    deleteStatus: function() { 
 
     alert('Delete Block Clicked: id = ' + $(this).attr('id')); 
 
    } 
 
    }); 
 
    
 
    $(document).on('click', '.action', function(e) { 
 
    if($(this).hasClass('upload')) { 
 
\t $(this).uploadStatus(); 
 
    } else { 
 
     $(this).deleteStatus(); 
 
    } 
 
    }); 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table class="table table-bordered"> 
 
    <thead> 
 
    <tr> 
 
     <th>Docket No. #</th> 
 
     <th>Del Date</th> 
 
     <th>Box</th> 
 
     <th>Status</th> 
 
     <th>Update</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody id="dsr-data"> 
 
    <tr> 
 
     <td>812210</td> 
 
     <td>2016-12-03</td> 
 
     <td>10</td> 
 
     <td>out for delivery</td> 
 
     <td> 
 
     <a class="action upload" id="upload-1"> 
 
     <img src="img/upload.png" alt="Upload"> 
 
     </a> 
 
     <a class="action delete" id="delete-1"> 
 
     <img src="img/delete.png" alt="Delete"> 
 
     </a> 
 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

・ホープ、このことができます！

Answer 2

代わりにこれを試すことができます。

<script> 
    function uploadStatus(id) { 
     alert('id =' + id); 
    } 

    function deleteStatus(id) { 
     alert('id =' + id); 
    } 
</script>