td에 다른 색상으로 색상 적용

td에 다른 텍스트 색상을 적용하고 있지만 마지막에 색상을 적용하면 td 이상의 모든 색상이 변경됩니다. 예 : 아래 코드에서 마지막 행은 빨간색이고,이 행을 실행 한 후 td 위의 색도 빨간색으로 변경됩니다. 이 문제로 어떻게 극복해야합니까? // HTMLtd에 다른 색상으로 색상 적용

'<table class="ui-widget" width="100%" border="0" cellspacing="1" cellpadding="2">'+ 
     '<thead class="ui-widget-header" id="orderListHead">'+ 
      '<tr>'+ 
       '<th><strong> Order# </strong></th>'+ 
       '<th><strong> Exchange </strong></th>'+  
      '</tr>'+ 
     '</thead>'+ 
     '<tbody id="orderListBody">'+    
     '</tbody>'+ 
    '</table>'+ 

if(orderList== "Buy"){      
    $("#orderListBody",this.orderListTable) 
     .append('<tr><td>'+orderList.ORDER_NUMBER+'</td><td>'+orderList.SHORT_NAME+'</td></tr>') 
     .css("color","green"); 
} 
if(orderList == "Sell"){     
    $("#orderListBody",this.orderListTable) 
     .append('<tr><td>'+orderList.ORDER_NUMBER+'</td><td>'+orderList.SHORT_NAME+'</td></tr>') 
     .css("color","red"); 
}

출처

2011-11-15 JN_newbie

를 추가하려면 html 코드 위의 스크립트와 관련하여 – run

특정'td'가 아닌'# orderListBody'에 CSS를 추가하고 있습니다 – diEcho

당신은하지 특정 행, 테이블에 CSS를 적용하고 그리고 당신이 정말로 같은 중복 코드가없는해야한다.

var newColor; 
if (orderList == "Buy") { 
    newColor = "green"; 
} else { 
    newColor = "red"; 
} 

$('<tr><td>'+orderList.ORDER_NUMBER+'</td><td>'+orderList.SHORT_NAME+'</td></tr>').css("color", newColor).appendTo($("#orderListBody",this.orderListTable));

이뿐만 아니라이 반복되는 코드를 제거 않지만,하지 테이블 셀렉터 만 새 행에 CSS를 적용

이 당신의 코드를 변경

출처

2011-11-15 07:23:37 jfriend00

어떻게 이런가 그리워 할 수 ... 많은 감사 jFriend00. –

내가 내가 아래 코드는 문제를 해결할 것이라 생각합니다 .. 귀하의 질문에 훨씬 명확하지 않다 ..

if(orderList== "Buy"){      
        $("#orderListBody",this.orderListTable).append('<tr><td>'+orderList.ORDER_NUMBER+'</td><td style="color:green">'+orderList.SHORT_NAME+'</td></tr>'); 
       } 
       if(orderList == "Sell"){      
        $("#orderListBody",this.orderListTable).append('<tr><td>'+orderList.ORDER_NUMBER+'</td><td style="color:red">'+orderList.SHORT_NAME+'</td></tr>'); 
      }

출처

2011-11-15 07:21:12

스타일 속성에 ";"가 있어야합니다. 결국. 그래서,'style = "color : green;"'&'style = "color : red;"' –

대신 다음과 같이 시도해보세요.

와 CSS를 추가의 3,516,는 :

.Buy { 
    color: green; 
} 
.Sell { 
    color: red; 
}

출처

2011-11-15 07:21:42 Godwin

+1 클래스를 사용하는 것이 색상을 직접 설정하는 것보다 훨씬 낫습니다. – RobG

좀 더 flexability와 코드를 다시 작성

$("$orderListBody, this.orderListTable) 
     .append("<tr class='" orderList + "'><td class='" + orderList + "'>" 
      +orderList.ORDER_NUMBER+ "</td><td class='" + orderList + "'>" 
      +orderList.SHORT_ORDER + "</td></tr>");

이제까지 당신이 예를 들어 같은 그런 다음 CSS에 당신이 할 수있는 : 당신은 전체 테이블에 CSS를 aplying하는

tr.Buy { background-color: yellow; } 
tr.Sell { background-color: red; } 

td.Buy { 
    color: green; 
} 

td.Sell { 
    color: red; 
}

출처

2011-11-15 07:25:35

td에 다른 색상으로 색상 적용

답변

관련 문제