동적으로 업데이트 된 함수가 작동하지 않습니다.

Question

JSON 형식으로 반환 된 배열에 대한 for 루프가 있습니다. 각 이미지의 ID는 &입니다. 그런 다음 일부 HTML을 포함하는 변수가 있고 요소 중 일부는 응답에 의해 동적으로 업데이트됩니다. 그런 다음 즐겨 찾기 SQL db에서 이미지를 추가/제거하는 기능이 있습니다. 그러나 함수를 앵커 태그의 onclick 이벤트에 추가하고 실행을 거부 한 데이터베이스에서 반환 된 ID를 사용합니다 (함수 및 ID가 이제 HTML에서 볼 수 있음에도 불구하고).

for (x in data.images) {    

    id = data.images[x].id, 
    name = data.images[x].name, 
    thumb = data.images[x].thumb  

output = '<div>\ 
       <a id="hil" href="viewer.php?id='+id+'">\ 
       <div>\ 
        <img width="160px" height="160px" src="'+thumb+'">\ 
       </div>\ 
       </a>\ 

        <div class="imft"> 
         <a id="deladd" onclick="deladd('+id+')" class="deladd"> 
          <img src="images/png/color_18/hand_thumbsup.png" /> 
         </a> 
        </div>\ 
         <div>'+name+'</div>\ 
       </div>'; 

     $('#theImages').append(output); 
     $('#theImagesLoading').html(''); 
     $('#next').html('More'); 

} 

(deladd되어 실행되지 않는 기능) ... 일부 코드에서 id는 함수에 전달되지만 onclick 이벤트가 작업을 거부합니다. 필요한 경우 더 많은 코드 및/또는 정보를 제공 할 수 있습니다.

사전에 도움을 주셔서 감사합니다. 마이클 기어 리에 대한

JSON 응답 :

{"amount":4,"from":0,"limit":4,"images":{"1":  {"id":"3084f8d07be00e8af2ab4e7810b2e011","name":"Blossom.jpg","thumb":"thumbnails\/43efd305ac4381b2911d2cbaf212f9e0.jpg","ival":0},"2":{"id":"649d38a79f5980735be80156a83a27ff","name":"Wedding Sunflowe...","thumb":"thumbnails\/01dfca88ce1e699a6ab5d0e5c4adac5e.jpg","ival":1},"3":{"id":"ed2a2ff0c4e9ae319cdd791d8643f9e7","name":"Butterfly.JPG","thumb":"thumbnails\/6adcbf9bdf4b803654b291b2744c8a3b.jpg","ival":2},"4":{"id":"2f5e5540eceb27f9332deeb4cb44ae1c","name":"Creek.jpg","thumb":"thumbnails\/14eafef60824b9c755fc1737e6914ef1.jpg","ival":3}}} 

Answer 1

이 코드에 몇 가지 문제가 있습니다

가

1. 배열을 통해 반복하는 for..in 루프를 사용하지 마십시오가. 대신 숫자 for 루프를 사용하십시오. (data.images가 []를 사용하여 배열이라고 나는 믿고있어, {}를 사용하지 않는 객체는,이 JSON 데이터의 예를 볼 좋은 것입니다 올바른 것을?입니다.) 당신은 모든 지역에 var 선언이 필요

2. 변수.

3. deladd() 호출에 대해 생성 한 HTML 코드에 ID 주위에 따옴표가 없습니다. (나는 ID가 문자열이고 숫자가 아니라고 가정하고 있습니다. 숫자라면 숫자는 그대로입니다.)

4. HTML 코드에 일부 \ 이스케이프가 누락되어 있지만 그저 오타가 있다고 가정합니다. 질문.

5. 들여 쓰기가 일관되지 않습니다.

이 해당 항목을 수정해야합니다 :

for(var i = 0, n = data.images.length; i < n; i++) { 

    var image = data.images[i], 
     id = image.id, 
     name = image.name, 
     thumb = image.thumb; 

    var output = 
     '<div>\ 
      <a id="hil" href="viewer.php?id='+id+'">\ 
       <div>\ 
        <img width="160px" height="160px" src="'+thumb+'">\ 
       </div>\ 
      </a>\ 
      <div class="imft">\ 
       <a id="deladd" onclick="deladd(\''+id+'\')" class="deladd">\ 
        <img src="images/png/color_18/hand_thumbsup.png" />\ 
       </a>\ 
       </div>\ 
       <div>'+name+'</div>\ 
     </div>'; 

    $('#theImages').append(output); 
    $('#theImagesLoading').html(''); 
    $('#next').html('More'); 
} 

또한,이 onclick 속성 대신이 이벤트 핸들러를 추가하기위한 다른 방법을 사용하는 것이 좋습니다 수 있습니다. 그러나 이것은 당신을 지금 당장 가야합니다.