Dreamer - I'm wendy~♥♥

출처 : http://egloos.zum.com/tiger5net/v/5667935

JQuery에 다른 기능을 검색하다가 아래의 사이트를 발견하여 나중에 도움이 될 듯하여 정리해둔다.

1. jQuery로 선택된 값 읽기

$("#selectBox option:selected").val();

$("select[name=name]").val();

2. jQuery로 선택된 내용 읽기

$("#selectBox option:selected").text();

3. 선택된 위치

var index = $("#test option").index($("#test option:selected"));

4. Add options to the end of a select

$("#selectBox").append("<option value='1'>Apples</option>");

$("#selectBox").append("<option value='2'>After Apples</option>");

5. Add options to the start of a select

$("#selectBox").prepend("<option value='0'>Before Apples</option>");

6. Replace all the options with new options

$("#selectBox").html("<option value='1'>Some oranges</option><option value='2'>MoreOranges</option>");

7. Replace items at a certain index

$("#selectBox option:eq(1)").replaceWith("<option value='2'>Someapples</option>");

$("#selectBox option:eq(2)").replaceWith("<option value='3'>Somebananas</option>");

8. 지정된 index값으로 select 하기

$("#selectBox option:eq(2)").attr("selected", "selected");

9. text 값으로 select 하기

$("#selectBox").val("Someoranges").attr("selected", "selected");

10. value값으로 select 하기

$("#selectBox").val("2");

11. 지정된 인덱스값의 item 삭제

$("#selectBox option:eq(0)").remove();

12. 첫번째 item 삭제

$("#selectBox option:first").remove();

13. 마지막 item 삭제

$("#selectBox option:last").remove();

14. 선택된 옵션의 text 구하기

alert(!$("#selectBox option:selected").text());

15. 선택된 옵션의 value 구하기

alert(!$("#selectBox option:selected").val());

16. 선택된 옵션 index 구하기

alert(!$("#selectBox option").index($("#selectBox option:selected")));

17. SelecBox 아이템 갯수 구하기

alert(!$("#selectBox option").size());

18. 선택된 옵션 앞의 아이템 갯수

alert(!$("#selectBox option:selected").prevAl!l().size());

19. 선택된 옵션 후의 아이템 갯수

alert(!$("#selectBox option:selected").nextAll().size());

20. Insert an item in after a particular position

$("#selectBox option:eq(0)").after("<option value='4'>Somepears</option>");

21. Insert an item in before a particular position

$("#selectBox option:eq(3)").before("<option value='5'>Someapricots</option>");

22. Getting values when item is selected

$("#selectBox").change(function(){

           alert(!$(this).val());

           alert(!$(this).children("option:selected").text());

});

출처 : http://blog.daum.net/twinsnow/124

http://cflove.org/2010/05/simple-jquery-textarea-maxlength-function.cfm 참조 

http://api.jquery.com/

출처 : http://api.jqueryui.com/accordion/

제가 쓴건...

      $(function () {

          $("#accordion").accordion({collapsible:true});

   $("#accordion").accordion("option", "animate", 100);

      });

요거...

아래는 api 내용..ㅎㅎ

ccordion Widgetversion added: 1.0

<div id="accordion">
  <h3>First header</h3>
  <div>First content panel</div>
  <h3>Second header</h3>
  <div>Second content panel</div>
</div>

$( ".selector" ).accordion({ active: 2 });

// getter
var active = $( ".selector" ).accordion( "option", "active" );
 
// setter
$( ".selector" ).accordion( "option", "active", 2 );

$( ".selector" ).accordion({ animate: 200 });

// getter
var animate = $( ".selector" ).accordion( "option", "animate" );
 
// setter
$( ".selector" ).accordion( "option", "animate", 200 );

$( ".selector" ).accordion({ collapsible: true });

// getter
var collapsible = $( ".selector" ).accordion( "option", "collapsible" );
 
// setter
$( ".selector" ).accordion( "option", "collapsible", true );

$( ".selector" ).accordion({ disabled: true });

// getter
var disabled = $( ".selector" ).accordion( "option", "disabled" );
 
// setter
$( ".selector" ).accordion( "option", "disabled", true );

$( ".selector" ).accordion({ event: "mouseover" });

// getter
var event = $( ".selector" ).accordion( "option", "event" );
 
// setter
$( ".selector" ).accordion( "option", "event", "mouseover" );

$( ".selector" ).accordion({ header: "h3" });

// getter
var header = $( ".selector" ).accordion( "option", "header" );
 
// setter
$( ".selector" ).accordion( "option", "header", "h3" );

$( ".selector" ).accordion({ heightStyle: "fill" });

// getter
var heightStyle = $( ".selector" ).accordion( "option", "heightStyle" );
 
// setter
$( ".selector" ).accordion( "option", "heightStyle", "fill" );

$( ".selector" ).accordion({ icons: { "header": "ui-icon-plus", "activeHeader": "ui-icon-minus" } });

// getter
var icons = $( ".selector" ).accordion( "option", "icons" );
 
// setter
$( ".selector" ).accordion( "option", "icons", { "header": "ui-icon-plus", "activeHeader": "ui-icon-minus" } );

$( ".selector" ).accordion( "destroy" );

$( ".selector" ).accordion( "disable" );

$( ".selector" ).accordion( "enable" );

var isDisabled = $( ".selector" ).accordion( "option", "disabled" );

var options = $( ".selector" ).accordion( "option" );

$( ".selector" ).accordion( "option", "disabled", true );

$( ".selector" ).accordion( "option", { disabled: true } );

$( ".selector" ).accordion( "refresh" );

var widget = $( ".selector" ).accordion( "widget" );

$( ".selector" ).accordion({
  activate: function( event, ui ) {}
});

$( ".selector" ).on( "accordionactivate", function( event, ui ) {} );

$( ".selector" ).accordion({
  beforeActivate: function( event, ui ) {}
});

$( ".selector" ).on( "accordionbeforeactivate", function( event, ui ) {} );

$( ".selector" ).accordion({
  create: function( event, ui ) {}
});

$( ".selector" ).on( "accordioncreate", function( event, ui ) {} );

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>accordion demo</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css">
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
</head>
<body>
 
<div id="accordion">
  <h3>Section 1</h3>
  <div>
    <p>Mauris mauris ante, blandit et, ultrices a, suscipit eget.
    Integer ut neque. Vivamus nisi metus, molestie vel, gravida in,
    condimentum sit amet, nunc. Nam a nibh. Donec suscipit eros.
    Nam mi. Proin viverra leo ut odio.</p>
  </div>
  <h3>Section 2</h3>
  <div>
    <p>Sed non urna. Phasellus eu ligula. Vestibulum sit amet purus.
    Vivamus hendrerit, dolor aliquet laoreet, mauris turpis velit,
    faucibus interdum tellus libero ac justo.</p>
  </div>
  <h3>Section 3</h3>
  <div>
    <p>Nam enim risus, molestie et, porta ac, aliquam ac, risus.
    Quisque lobortis.Phasellus pellentesque purus in massa.</p>
    <ul>
      <li>List item one</li>
      <li>List item two</li>
      <li>List item three</li>
    </ul>
  </div>
</div>
 
<script>
$( "#accordion" ).accordion();
</script>
 
</body>
</html>

[출처] 【jQuery】팝업창 opener|작성자 너와나