내 행에 식별자를 추가하는 방법에 대한 문제가 있습니다. json 데이터를 사용하여 테이블 본문을 채우는 코드가 있습니다.
var table = '';
$.each(result, function (i, item) {
table += '<tr class="test"><td>' + item.ip_address + '</td><td>' + item.app_name + '</td><td>' + item.crit_severity + '</td><td>' + item.user_password + '</td></tr>';
});
$("#tableLinks tbody").html(table);
이 테이블이 있습니다
<table class="table table-bordered" id="tableLinks" style="width:70%;margin">
<thead>
<tr>
<th>IP ADDRESS</th>
<th>APPLICATION NAME</th>
<th>CRIT/SEVERITY</th>
<th>USERNAME/PASSWORD</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
이 코드를 사용하여 테스트했지만 작동하지 않습니다. 여기서 오류는 무엇일까요? 감사
$(".test").on('click', function() {
alert('test');
});
현재 사용중인 것을 "직접"바인딩이라고하며 코드가 이벤트 바인딩을 호출 할 때 페이지에있는 요소에만 연결됩니다.
당신은 사용할 필요가 이벤트 위임을 사용하여 ) CSTE 연구진를 ( (제거 및 클래스를 추가하는 등)을 동적으로 요소 또는 조작 선택기를 생성 할 때, 위임-이벤트 접근.
일반 구문
$(staticParentSelector).on('event','selector',callback_function)
예
$("#tableLinks tbody").on('click', ".test", function(){
alert('test');
});
대신 document
가장 가까운 정적 컨테이너를 사용해야합니다.
위임 된 이벤트는 나중에 문서에 추가되는 하위 요소의 이벤트를 처리 할 수 있다는 장점이 있습니다. 위임 된 이벤트 처리기가 연결될 때 존재하도록 보장되는 요소를 선택하면 위임 된 이벤트를 사용하여 클릭 이벤트를 동적으로 생성 된 요소에 바인딩하고 이벤트 처리기를 자주 연결하고 제거 할 필요가 없습니다.
$(function() {
$("#tableLinks tbody").on('click', ".test", function() {
snippet.log('test');
});
var result = [{
ip_address : 123456,
app_name:'test',
crit_severity: 'crit_severity',
user_password: 'user_password'
}];
var table = '';
$.each(result, function(i, item) {
table += '<tr class="test"><td>' + item.ip_address + '</td><td>' + item.app_name + '</td><td>' + item.crit_severity + '</td><td>' + item.user_password + '</td></tr>';
});
$("#tableLinks tbody").html(table);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!-- Provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>
<table class="table table-bordered" id="tableLinks" style="width:70%;margin">
<thead>
<tr>
<th>IP ADDRESS</th>
<th>APPLICATION NAME</th>
<th>CRIT/SEVERITY</th>
<th>USERNAME/PASSWORD</th>
</tr>
</thead>
<tbody>
</tbody>
</table>
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다