2013-04-07 7 views
0

내 앱에서 jQuery를 사용하고 있습니다. 내 목표는 텍스트 필드 옆에 유효성 검사 오류를 표시하는 것이지만 실제로는 div 내용을 대체합니다.JQuery div에 스팬 클래스 추가

<div class="control-group"> 
    <label class="control-label">Nom d'équipe</label> 
    <div class="controls" id="nom_equipe"> 
     <input type="text" name="nom_equipe" value="" class="input-xlarge">     </div> 
</div> 

그래서 나는 아약스와 양식 오류를 검색하고이 내가하는 일입니다 :

if(data.validate == false) 
{ 
    if(data.nom_equipe != '') 
    { 
     $("#nom_equipe").append("span").addClass("label label-important").text(data.nom_equipe); 
    } 
} 

을하지만 이렇게 = nom_equipe을 내 DIV ID의 전체 내용을 대체

<div class="control-group"> 
    <label class="control-label">Nom d'équipe</label> 
    <div class="controls label label-important" id="nom_equipe">Le champ Nom équipe est requis.</div> 
</div> 

마지막으로 이것은 내가 갖고 싶은 것입니다 :

<div class="control-group"> 
<label class="control-label">Nom d'équipe</label> 
<div class="controls" id="nom_equipe"> 
    <input type="text" name="nom_equipe" value="" class="input-xlarge"> 
    <span>The field nom_equipe is required </span> 
      </div> 

추 신 : span div의 내용은 ajax 요청에서 유래합니다.

답변

8

append("span")에는 span 요소가 추가되지 않으며 텍스트는 "span"입니다. 스팬 요소를 추가하려면 append('<span>')이 필요합니다.

는 또한 클래스는 주요 요소에 덜 함수 호출을 필요로하며 개별 전화보다 종종 더 적은 코드 코드를 작성하는 방법과 jQuery를 클래스와 텍스트가 포함와 HTML 문자열을 연결

를 작동하는 방식을 추가됩니다 방법은 기존 코드의 주요 문제는 체인이 사용도 함께 text()이 사용되고 있다는 요소는 여전히 원래 $("#nom_equipe")이라고하는 요소

$("#nom_equipe").append("<span class='label label-important'>"+data.nom_equipe+'</span>'); 

을 만들 수 있습니다. text('text string')은 해당 요소 내의 모든 HTML을 바꿉니다

+0

에 추가됩니다. 해결책을 찾아 주셔서 감사합니다. – TLR

+0

@charlietfl 이봐, 내 친구, 어떻게 당신이'''로 시작하고 추가 할 때'''로 끝나는가?이게 실제로 가능한가? –

+0

@IliaRostovtsev는 확실히 가능하다. 나는 intiial 복사/붙여 넣기로 인해 그것을했을 가능성이 있지만 다른 부분에 대한 내 자신의 환경 설정으로 변경되었습니다. 'var str ='a '+ "b"+'c'' 완벽하게 유효합니다 ... 모든 열기 및 닫기 따옴표는 – charlietfl

1

이미 보유하고있는 콘텐츠를 유지하려면 text() 대신 append()을 사용해야합니다. 정합 소자들의 세트 내의 각각의 소자의 단부에 매개 변수에 의해 지정된 콘텐츠

$("#nom_equipe").append("<span class='label label-important'>" + data.nom_equipe + "</span>"); 

Append() 인서트.

+1

이 솔루션의 범위가 추가되지 않고 클래스가 기본 요소 – charlietfl

관련 문제