2009-06-15 5 views
3

그룹으로 묶어야하는 요소가 많이 있습니다.하지만 변경할 수없는 기계에서 뱉어 내기 때문에 jquery를 사용해야합니다. 기본적으로 꽤 익숙한)jquery를 사용하여 요소를 그룹으로 묶기

기본적으로 나는 p 태그와 div가 느슨한 양식 요소 (예 : 불량 마크 업,하지만 다른 이야기입니다)가 있습니다. 필드 집합 안에 다음과 같은 하나 또는 두 개의 div로 p 태그를 그룹화해야합니다.

, 나는 각 페이지의 요소 앞에 태그를 시작 한 후 닫고 필드 셋을 삽입하려고했지만, 만약 내가 제대로 이해하고 그

+1

그것을 밤은 당신이 뭘 하려는지 특히 분명. – gubby

+0

좋아, 나는 그것을 시도하고 지울거야. 나는 이런 식으로 뭔가있어 : 페이지 사업부 사업부 페이지 사업부 사업부 페이지 사업부 페이지 사업부를 나는 내 다음 하나 또는 두 개의 div를 함께 그룹화 각 페이지 요소를해야 할 일은 fieldset element – chrism

답변

7

작동하지 않도록 나는, 법적 요소를 삽입하고 싶은 그것을 밖으로 정렬 기계를 추측 당신은 마크 업 이런 식으로 뭔가 보이는 문서가 있습니다

<p>paragraph 1</p> 
<div>par1 div1</div> 
<div>par1 div2</div> 
<p>paragraph 2</p> 
<div>par2 div1</div> 
<div>par2 div2</div> 
<p>paragraph 3</p> 
<div>par3 div1</div> 
<p>paragraph 4</p> 
<div>par4 div1</div> 

을 그리고 당신은 이런 식으로 뭔가와 끝까지 할이가 C 인 경우

<fieldset> 
<p>paragraph1</p> 
<div>par1 div1</div> 
<div>par1 div2</div> 
</fieldset> 
<fieldset> 
<p>paragraph2</p> 
<div>par2 div1</div> 
<div>par2 div1></div> 
</fieldset> 
..... 

ASE는,이 jQuery를 조각은 트릭을 할 것입니다 :

$(function(){ 
    $('p').each(function(index,item){ 
     var nextDiv = $(item).next(); 
     var followingDiv = $(nextDiv).next('div'); 
     $(item).wrap("<fieldset id='fieldset" + index + "'></fieldset>"); 
     $("#fieldset"+index).append(nextDiv).append(followingDiv); 
    }); 
}); 
+0

고마워, 너와 비슷한 것은 아니지만 비슷한 것을 생각해 냈어. – chrism

1

JoseBasillo의 대답은 간단하고 약간 일반화 될 수 @ :

var $wrapper = $('#wrapper'); 
$wrapper.children('p').each(function(index,item) { 
    var $following = $(item).nextUntil('p, fieldset'); 
    $wrapper.append($('<fieldset>').append(item, $following)); 
}); 

Demo

코드는

<div id="wrapper"> 
    <p>paragraph 1</p> 
     ... (whatever but p or fieldset) 
    <p>paragraph 2</p> 
     ... (whatever but p or fieldset) 
    ... (p followed by whatever but p or fieldset) 
</div> 
변환을

누군가가 가독성보다 짧은 코드를 선호하는 경우 16,
<div id="wrapper"> 
    <fieldset> 
     ... (whatever but p or fieldset) 
    </fieldset> 
    <fieldset> 
     ... (whatever but p or fieldset) 
    </fieldset> 
    ... (fieldset containg [p followed by whatever but p or fieldset]) 
</div> 

이 변수 $following 사용할 필요가 없습니다 :

var $wrapper = $('#wrapper'); 
$wrapper.children('p').each(function(index,item) { 
    $wrapper.append($('<fieldset>').append(item, $(item).nextUntil('p, fieldset'))); 
}); 
관련 문제