2013-06-27 3 views
-1

JQuery UI의 .button() 메서드로 라디오 버튼을 스킨하려고합니다.JQuery .button() 메서드는 아무 작업도 수행하지 않습니다.

다음은 버튼에 대한 코드입니다 :

<input value name="U1" id="U1:1" type="radio" class="languageWidget"> 

그리고 여기에 해당하는 자바 스크립트입니다 :

$(document).ready(function() { 
     $("input.languageWidget").button(); 
    }); 

나는 콘솔 오류의 종류를받지 못했습니다과 페이지가 여전히 잘로드합니다. 버튼을 재구성하지 않습니다. 모든 단서?

+0

? 그런 방법이 없습니다 http://api.jquery.com/ – zerkms

+2

jQuery에는 버튼 메소드가 없습니다. jQuery UI를 포함 시켰습니까? –

+1

당신은 실패한 바이올린을 가지고 있습니까? 모든 CSS 및 이미지 애셋이로드되고 있습니까? jQuery UI 라이브러리를 올바르게로드하고 있습니까? 다른 JQUI 함수가 작동합니까? –

답변

1

라디오 버튼의 경우 다소 복잡합니다 (너무 많지는 않음).

먼저 buttonset() 메서드로 all-at-once를 초기화하는 버튼 세트가 포함 된 DIV가 필요합니다.

다음으로 표시 및 클릭 가능하게되는 레이블이기 때문에 <label for="this_button_id">이 필요합니다. 따라서 라디오 버튼을 사용하면 레이블이 입력 컨트롤이 아닌 버튼이됩니다.

따라서 <input> 요소의 ID와 <label> 요소의 for=이 일치해야합니다.

는 어떻게해야 무엇

jsFiddle


<html> 
    <head> 
     <link rel="stylesheet" href="http://code.jquery.com/ui/1.9.1/themes/base/jquery-ui.css" /> 
     <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
     <script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script> 

     <script type="text/javascript"> 
      $(document).ready(function() { 

       $('#testdiv').buttonset(); 

      }); //END $(document).ready() 

     </script> 
    </head> 
<body> 

<!--<input name="U1" id="U1-1" type="radio" class="languageWidget" />--> 
<div id="testdiv"> 
    <input type="radio" id="U1-1" name="U1-1" /><label for="U1-1">Choice 1</label> 
    <input type="radio" id="U1-2" name="U1-2" checked="checked" /><label for="U1-2">Choice 2</label> 
    <input type="radio" id="U1-3" name="U1-3" /><label for="U1-3">Choice 3</label> 
</div> 

</body> 
</html> 
관련 문제