jQuery Selectable Method : สอน method และ property ของ Selectable Method, เรียน method และ property ของ Selectable Method
 

Reference

Reference ในเว็บไซต์ Function.in.th เป็นการนำเสนอความรู้ในรูปแบบของแหล่งอ้างอิงของคำสั่งต่าง ๆ ที่ใช้ในการเขียนโปรแกรม โดยผู้ที่สนใจสามารถเข้ามาเรียนรู้การใช้งานคำสั่งของการเขียนโปรแกรมเหล่านี้ได้ ผ่านทาง URL code.function.in.th ทั้งนี้ผู้อ่านยังสามารถร่วมแสดงความคิดเห็นบนเนื้อหาที่มีสอนได้ ซึ่งถือเป็นการส่งเสริมให้มีการแลกเปลี่ยนประสบการณ์และความรู้ระหว่างผู้อ่านด้วยกันเอง
  • selectable ( options ) ใช้กำหนดให้ ทุก element ภายใน set มีคุณสมบัติ selectable ( การเลือก การลากเมาส์เลือก )
    disabled ใช้กำหนดสถานะของการ sorting ว่ายังใช้งานไม่ได้ ใช่หรือไม่ (default=false)
    delay ใช้กำหนดเวลาหน่วงหลังจาก mousedown จนกระทั่งการ selectable เริ่มขึ้น หน่วย millisecond (default=0)
    filter ใช้กำหนด selector ที่ใช้บ่งบอกถึง item ที่จะสามารถถูก selectable ได้ (default=
    tolerance ให้กำหนดลักษณะ การวาง ของ selectable-element ในกรณีที่สามารถวางบน element อื่นได้
    start ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อการ selectable เริ่มขึ้น
    stop ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อการ selectable สิ้นสุด
    selecting ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อกำลัง selecting และ element มีการถูก selecting
    unselecting ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อกำลัง selecting และ element มีการถูก unselecting
    selected ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อสิ้นสุดการ selecting และ element มีการถูก selecting
    unselected ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อสิ้นสุดการ selecting และ element มีการถูก unselecting
  • syntax :
    selectable ( options )

    return type :
    void, element

    content :
    ใช้กำหนดให้ ทุก element ภายใน set มีคุณสมบัติ selectable ( การเลือก การลากเมาส์เลือก )
    โดย options ให้กำหนดค่า config ต่างๆ ให้กับการ selectable ได้แก่
    disabled, delay, filter, tolerance, start, stop, selecting, unselecting, selected, unselected 

    example :
    $("ul#selectable").selectable ( { disabled: true, delay: 50 } );
    var items = $("ul#selectable").selectable ( "option", "filter" );		// ใช้คืนค่าข้อมูลของ property ที่กำหนด
    $("ul#selectable").selectable ( "option", "filter", "li" );		// ใช้กำหนดค่าให้กับ property ที่กำหนด

  • config :
    disabled

    return type :
    boolean

    content :
    ใช้กำหนดสถานะของการ sorting ว่ายังใช้งานไม่ได้ ใช่หรือไม่ (default=false)

    example :
    $("ul#selectable").selectable ( { disabled: true } );

  • config :
    delay

    return type :
    integer

    content :
    ใช้กำหนดเวลาหน่วงหลังจาก mousedown จนกระทั่งการ selectable เริ่มขึ้น หน่วย millisecond (default=0)

    example :
    $("ul#selectable").selectable ( { delay: 0 } );

  • config :
    filter

    return type :
    selector

    content :
    ใช้กำหนด selector ที่ใช้บ่งบอกถึง item ที่จะสามารถถูก selectable ได้ (default="*")

    example :
    $("ul#selectable").selectable ( { filter: "*" } );

  • config :
    tolerance

    return type :
    string

    content :
    ให้กำหนดลักษณะ การวาง ของ selectable-element ในกรณีที่สามารถวางบน element อื่นได้ โดยกำหนด
    ดังนี้ touch คือเมื่อโดนก็ถือว่า selectable แล้ว
    และ fit คือต้องตำแหน่งทับกันพอดีจึงจะถือว่า selectable
    (default=touch)

    example :
    $("ul#selectable").selectable ( { tolerance: "touch" } );

  • config :
    start

    return type :
    function

    content :
    ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อการ selectable เริ่มขึ้น
    โดยจะมี parameter 2 ตัว ได้แก่ event object และ object ที่มี property 
    ดังนี้ helper จะคืนค่า helper element, position จะคืนค่า object ที่มี property ของ top และ left ของการเริ่มต้น selectable

    example :
    $("ul#selectable").selectable ( { start: function(event,object) { alert ( "selectable start" ); } } );

  • config :
    stop

    return type :
    function

    content :
    ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อการ selectable สิ้นสุด
    โดยจะมี parameter 2 ตัว ได้แก่ event object และ object ที่มี property 
    ดังนี้ helper จะคืนค่า helper element, position จะคืนค่า object ที่มี property ของ top และ left ของการสิ้นสุดการ selectable

    example :
    $("ul#selectable").selectable ( { stop: function(event,object) { alert ( "selectable stop" ); } } );

  • config :
    selecting

    return type :
    function

    content :
    ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อกำลัง selecting และ element มีการถูก selecting
    โดยจะมี parameter 2 ตัว ได้แก่ event object และ object ที่มี property 
    ดังนี้ helper จะคืนค่า helper element, position จะคืนค่า object ที่มี property ของ top และ left ของการกำลัง selecting

    example :
    $("ul#selectable").selectable ( { selecting: function(event,object) { alert ( "selectable selecting" ); } } );

  • config :
    unselecting

    return type :
    function

    content :
    ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อกำลัง selecting และ element มีการถูก unselecting
    โดยจะมี parameter 2 ตัว ได้แก่ event object และ object ที่มี property 
    ดังนี้ helper จะคืนค่า helper element, position จะคืนค่า object ที่มี property ของ top และ left ของการกำลัง selecting

    example :
    $("ul#selectable").selectable ( { unselecting: function(event,object) { alert ( "selectable unselecting" ); } } );

  • config :
    selected

    return type :
    function

    content :
    ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อสิ้นสุดการ selecting และ element มีการถูก selecting
    โดยจะมี parameter 2 ตัว ได้แก่ event object และ object ที่มี property 
    ดังนี้ helper จะคืนค่า helper element, position จะคืนค่า object ที่มี property ของ top และ left ของการสิ้นสุดการ selectable

    example :
    $("ul#selectable").selectable ( { selected: function(event,object) { alert ( "selectable selected" ); } } );

  • config :
    unselected

    return type :
    function

    content :
    ใช้กำหนด function ที่จะถูกเรียกใช้เมื่อสิ้นสุดการ selecting และ element มีการถูก unselecting
    โดยจะมี parameter 2 ตัว ได้แก่ event object และ object ที่มี property 
    ดังนี้ helper จะคืนค่า helper element, position จะคืนค่า object ที่มี property ของ top และ left ของการสิ้นสุดการ selectable

    example :
    $("ul#selectable").selectable ( { unselected: function(event,object) { alert ( "selectable unselected" ); } } );

 
Share This Chapter Login with Facebook