특정 selectable() jquery의 배경을 변경하십시오.

Question

jquery를 사용하여 선택 가능한 함수에서 하나의 특정 요소의 색을 변경하려고합니다.

<ol id="selectable"> 
    <li class="ui-widget-content" id="s1">Option 1</li> 
    <li class="ui-widget-content" id="s2">Option 2</li> 
    <li class="ui-widget-content" id="s3">Option 3</li> 
    <li class="ui-widget-content" id="s4">Option 4</li> 
    <li class="ui-widget-content" id="s5">Option 5</li> 
</ol> 

배경색을 id = "s4"로 변경하고 싶지만 가능한지 모르겠다.

기능은 다음과 같습니다

이미 JQuery와 및 CSS하지만 여전히 아무것도 시도

$(function() { 
    $("#selectable").selectable();  
}); 

.

Answer 1

당신은 create 이벤트

을 사용할 수 있습니다

$(function() { 
    $("#selectable").selectable({ 
     create: function(event, ui) { 
      $("#s4").css('background', 'red'); 
     }, 
     selected: function(event, ui) { 
      $(ui.selected).css('background', 'yellow'); 
     } 
    }); 
}); 

Fiddle

Answer 2

확인이 fiddle

스크립트 :

 $(document).ready(function(){ 
     $(".myGrid").click(function(){ 
      $(".myGrid").each(function() { 
       $(this).css('background-color', ''); 
      }); 
      $(this).css('background-color', 'red'); 
      }); 
     }); 

HTML :

이 드롭 다운 모든 종류의

<ol id="selectable"> 
     <li class="ui-widget-content myGrid" id="s1">Option 1</li> 
     <li class="ui-widget-content myGrid" id="s2">Option 2</li> 
     <li class="ui-widget-content myGrid" id="s3">Option 3</li> 
     <li class="ui-widget-content myGrid" id="s4">Option 4</li> 
     <li class="ui-widget-content myGrid" id="s5">Option 5</li> 
</ol> 

Answer 3

당신은 그냥

#selectable #s4.ui-selected { background: red; }