2014-12-14 3 views
2

.php ID 번호를 기반으로 2 개의 그룹을 만드는 예외를 만들려고합니다.자바 스크립트 ID 그룹화

현재 이미지 테이블을 채우고 자바 스크립트를 사용하여 그룹으로 나누고 싶습니다. 나는 다른 한 번에 6 개 이미지의 부분을 할 수있는 제품의 ID 번호를 기반으로 여러 DIV 년대에이를 분할하는 방법에 대한 몇 가지 간단한 조언을 찾고

var currentResults; 

function init() { 
getProducts();} 

function getProducts() { 
$.ajax({ 
    url:"php/products.php", 
    dataType: "json", 
    data: { public: true }, 
    success:function(result){ 
     processResults(result); 
    } 
});} 

function processResults(results) { 
currentResults = null; 

if (!results && !results.products) 
    return; 

currentResults = results.products; 

for (var i = 0; i < results.products.length; i++) { 
    processResult(results.products[i]);} 

$(".galleryitem").click(handleThumbnailClick);} 

function processResult(result) { 
    var newDiv = '<div id="galleryitem' + result.id + '" class="galleryitem">'; 

    newDiv += '<div class="imageHover" style="background: ' + result.color + '">&nbsp;</div>'; 
    newDiv += '<img class="galleryImage" src="' + encodeImagePath(result.thumbnail) + '" />'; 

if (result.artist) 
    newDiv += '<div class="imageArtist">' + result.artist + '</div>'; 

    newDiv += '</div>'; 

$('#gallery').append(newDiv);} 

function handleThumbnailClick(e) { 
    if (!e || !e.currentTarget || !e.currentTarget.id) 
    return; 

    var id = e.currentTarget.id.substring(11); 

window.location = 'product.php?id=' + id;} 

function encodeImagePath(path) { 
return path.replace(/#/g, '%23');} 

을 :

현재 스크립트는 다음과 같습니다 헤더 텍스트.

주세요. 감사합니다! 나는 당신의 아이디어 권리를 가지고 있지만, 이런 일이 (제품이 서버에서 얻고 JSON의 경우에 당신은 "부모"속성이) 문제를 해결해야하는 경우

+0

#gallery에 div를 추가 할 때마다 클릭 이벤트를 첨부 할 필요가 없습니다. –

+0

"ID 기반"이란 정확히 무엇을 의미합니까? "("클릭 ",".galleryitem ", function() {/ * some code * /}); DB의 자동 증가 필드가 항상 +1을 증가시키는 것은 아닙니다. 예를 들어, 3 개의 서버 클러스터에서 삽입 쿼리를 처리하는 서버에 따라 +1, +2 또는 +3이됩니다. –

답변

0

확실하지 :

function processResult(result) { 
    if (typeof(result.parent) !== 'undefined') { // see if the element has a parent 
     var newDiv = 'markup goes here'; // if some of the markup would be reused you can create a new function for this 

     $('#galleryitem' + result.parent).append(newDiv); // just make sure the parent is already there 
    } else { 
     var newDiv = '<div id="galleryitem' + result.id + '" class="galleryitem">'; // default behavior that you alreay had 

     // code skipped for brevity 

     $('#gallery').append(newDiv); 
    } 
} 

추신 코드 형식에 대해 작업해야합니다. 형식이 잘 지정되어 있으면 훨씬 쉽게 읽을 수 있습니다.

관련 문제