2013-03-13 103 views
0

我有一個ajax調用,我希望在成功函數中遍歷類中的每個標籤,並將它們的值設置爲已從服務器響應返回的值。下是代碼然而,這將所有的標籤設置爲相同的值,這不是我想要我想訪問該項目的索引,並只設置該索引的響應值。我要去哪裏錯了?:這裏html循環中索引位置的html標籤的jquery設置值

JQuery的:

function GetCitizenTypeDescription(citizenTypeId){     
     $.ajax({ 
     type:'GET', 
     url:'getCitizenTypeDescription.htm', 
     data:{citizenTypeId:citizenTypeId}, 
     dataType: 'text', 
     success: function (data) {  
     $('.citizenTypeDesc').each(function(i){     
       alert(data); 
       $('.citizenTypeDesc').text(data);  
     }); 
    } 


    }); 

} 


$(document).ready(function() {  


     $(".photos").each(function(i){     

      if ($(this).val() != '') { 
        var image = new Image();      
        image.src = $(this).val(); 

        image.onload = function(){ 

          var ctx = document.getElementsByClassName("canvas")[i].getContext('2d'); 
          ctx.drawImage(image,0,0, 320, 240); 
       }      
     }  



    }); 

    $('.citizenTypeDesc').each(function(i){ 

      var citizenTypeId = document.getElementsByClassName("citizenTypeId")[i].value; 
      GetCitizenTypeDescription(citizenTypeId); 

    }); 


}); 

控制檯返回正確的數據,我只是需要把它寫入標籤

控制檯:

GET http://localhost:8084/crimeTrack/getCitizenTypeDescription.htm?citizenTypeId=2 200 OK 174ms 
Response 
CRIMINAL 

GET http://localhost:8084/crimeTrack/getCitizenTypeDescription.htm?citizenTypeId=3 200 OK 174ms 
Response 
VICTIM 

GET http://localhost:8084/crimeTrack/getCitizenTypeDescription.htm?citizenTypeId=4 200 OK 174ms 
Response 
.... 

html

</head> 
<body> 
<div id ="content"> 
<c:forEach items="${citizens}" var="citizen"> 
<div id="table">  
    <div> 
     <p><canvas class="canvas" height="240" width="320"></canvas> 
    </div> 
     <a href="citizen_registration.htm">Name:- ${citizen.fName} ${citizen.lName}</a> 
     <input type="hidden" id="photo" value="${citizen.photo}" class="photos"/> 
     <input type="hidden" id="socialSecurityNumber" value="${citizen.socialSecurityNumber}" /> 
     <input type="text" class="citizenTypeId" value="${citizen.citizenTypeId}"/> 
     <label class="citizenTypeDesc"></label> 
</div> 
</c:forEach> 
</div> 
</body> 
</html> 
+1

返回時數據字符串是什麼樣的? – 2013-03-13 16:15:46

+1

假設'data'代表一個數組。我的猜測只需要看一眼它就可以得到這樣的結果: '$('。citizenTypeDesc').text(data [i]);' – Calvin 2013-03-13 16:18:31

+0

@JakeZeitz數據是文本,它只返回一個文本item @ – devdar 2013-03-13 16:20:05

回答

1

相反遍歷所有.citizenTypeDesc標籤你可以遍歷所有.citizenTypeId的的。測試每個值是否與參數匹配,然後設置同一父元素內的標籤。

function GetCitizenTypeDescription(citizenTypeId){     
    $.ajax({ 
    type:'GET', 
    url:'getCitizenTypeDescription.htm', 
    data:{citizenTypeId:citizenTypeId}, 
    dataType: 'text', 
    success: function (data) {  
     $('.citizenTypeId').each(function(i){     
      //does this value match the parameter 
      if($(this).val() === citizenTypeId){ 
       //find the parent div, in this case .table 
       var parent = $(this).parent(); 
       //search for a child with class .citizenTypeDesc 
       var thisCitizenTypeDesc = parent.children('.citizenTypeDesc'); 

       thisCitizenTypeDesc.text(data); 
      } 
     }); 
    } 
    }); 
} 
+0

非常感謝這工作得很好 – devdar 2013-03-13 17:39:49