JavaScript Select Object : สอน method และ property ของ Select Object, เรียน method และ property ของ Select Object
 

Reference

Reference ในเว็บไซต์ Function.in.th เป็นการนำเสนอความรู้ในรูปแบบของแหล่งอ้างอิงของคำสั่งต่าง ๆ ที่ใช้ในการเขียนโปรแกรม โดยผู้ที่สนใจสามารถเข้ามาเรียนรู้การใช้งานคำสั่งของการเขียนโปรแกรมเหล่านี้ได้ ผ่านทาง URL code.function.in.th ทั้งนี้ผู้อ่านยังสามารถร่วมแสดงความคิดเห็นบนเนื้อหาที่มีสอนได้ ซึ่งถือเป็นการส่งเสริมให้มีการแลกเปลี่ยนประสบการณ์และความรู้ระหว่างผู้อ่านด้วยกันเอง
  • focus() ใช้กำหนดให้ selectได้รับ focus
    blur() ใช้กำหนดให้ select สูญเสีย focus
    click() ใช้กำหนดให้ เหมือนมีการ click ที่ select
    name ใช้ในการกำหนดค่า หรือคืนค่า name ของ select
    id ใช้ในการกำหนดค่า หรือคืนค่า id ของ select
    value ใช้ในการกำหนดค่า หรือคืนค่า value ของ select
    form ใช้คืนค่า form element ของ select
    size ใช้ในการกำหนดค่า หรือคืนค่า ขนาดของ select
    tabIndex ใช้ในการกำหนดค่า หรือคืนค่า ลำดับการได้รับ focus ของ select เมื่อกดปุ่ม tab
    accessKey ใช้ในการกำหนดค่า หรือคืนค่า คีย์ลัด ( จากการกดปุ่ม alt + key )
    disabled ใช้ตรวจสอบ หรือกำหนดค่า ว่าจะให้ select นี้ทำงานหรือไม่
    accept ใช้กำหนดค่า หรือคืนค่า ชนิดของเนื้อหาที่จะส่งไป server
    align ใช้กำหนดค่า หรือคืนค่า ตำแหน่งข้อความ ของ select
    alt ใช้กำหนดค่า หรือคืนค่า ข้อความที่ใช้แสดง ในกรณีที่ browser ไม่สนับสนุน object นี้
    length ใช้ในการคืนค่า จำนวน option ทั้งหมดที่ select มี
    selectedIndex ใช้ในการคืนค่า ลำดับที่ ( index ) ของ option ที่ถูกเลือกอยู่
    options ใช้ในการอ้างถึง element option ของ select
    onfocus ใช้กำหนดให้ function ทำงานเมื่อ select ได้รับ focus
    onblur ใช้กำหนดให้ function ทำงานเมื่อ select สูญเสีย focus
    onclick ใช้กำหนดให้ function ทำงานเมื่อ select ถูก click
    onchange ใช้กำหนดให้ function ทำงานเมื่อ select มีการเปลี่ยนแปลง
    index ใช้คืนค่าลำดับที่ ( index ) ของ option
    text ใช้คืนค่า ข้อความ ของ option
    value ใช้คืนค่า value ของ option
    selected ใช้คืนค่า เพื่อตรวจสอบว่า option นี้ถูกเลือกอยู่หรือไม่
    defaultSelected ใช้คืนค่า เพื่อตรวจสอบว่า option นี้ถูกเลือกไว้ตั้งแต่ต้นหรือไม่
  • method :
    focus ();

    return type :
    void

    content :
    ใช้กำหนดให้ selectได้รับ focus

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.focus();

  • method :
    blur ();

    return type :
    void

    content :
    ใช้กำหนดให้ select สูญเสีย focus

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.blur();

  • method :
    click ();

    return type :
    void

    content :
    ใช้กำหนดให้ เหมือนมีการ click ที่ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.click();

  • property :
    name;

    return type :
    string, void

    content :
    ใช้ในการกำหนดค่า หรือคืนค่า name ของ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.name );

  • property :
    id;

    return type :
    string, void

    content :
    ใช้ในการกำหนดค่า หรือคืนค่า id ของ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.id );

  • property :
    value;

    return type :
    string, void

    content :
    ใช้ในการกำหนดค่า หรือคืนค่า value ของ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.value );

  • property :
    form;

    return type :
    form

    content :
    ใช้คืนค่า form element ของ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.form );

  • property :
    size;

    return type :
    string, void

    content :
    ใช้ในการกำหนดค่า หรือคืนค่า ขนาดของ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.size );

  • property :
    tabIndex;

    return type :
    string, void

    content :
    ใช้ในการกำหนดค่า หรือคืนค่า ลำดับการได้รับ focus ของ select เมื่อกดปุ่ม tab

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.tagIndex = "5";

  • property :
    accessKey;

    return type :
    string, void

    content :
    ใช้ในการกำหนดค่า หรือคืนค่า คีย์ลัด ( จากการกดปุ่ม alt + key )

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert  ( tagSelect.accessKey );

  • property :
    disabled;

    return type :
    boolean, void

    content :
    ใช้ตรวจสอบ หรือกำหนดค่า ว่าจะให้ select นี้ทำงานหรือไม่

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    if ( tagSelect.disabled )
    {
         alert ( "select is not enabled" );
    }

  • property :
    accept;

    return type :
    string, void

    content :
    ใช้กำหนดค่า หรือคืนค่า ชนิดของเนื้อหาที่จะส่งไป server

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.accept );

  • property :
    align;

    return type :
    string, void

    content :
    ใช้กำหนดค่า หรือคืนค่า ตำแหน่งข้อความ ของ select
    โดยค่าข้อมูลที่เป็นไปได้ คือ right, left, center

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.align = "right";
    

  • property :
    alt;

    return type :
    string, void

    content :
    ใช้กำหนดค่า หรือคืนค่า ข้อความที่ใช้แสดง ในกรณีที่ browser ไม่สนับสนุน object นี้

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.alt );

  • property :
    length;

    return type :
    string

    content :
    ใช้ในการคืนค่า จำนวน option ทั้งหมดที่ select มี

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.length );

  • property :
    selectedIndex;

    return type :
    number

    content :
    ใช้ในการคืนค่า ลำดับที่ ( index ) ของ option ที่ถูกเลือกอยู่

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.selectedIndex );

  • property :
    options;

    return type :
    node array

    content :
    ใช้ในการอ้างถึง element option ของ select

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    alert ( tagSelect.options.item( tagSelect.selectedIndex ).text );

  • property :
    onfocus = function;

    return type :
    void

    content :
    ใช้กำหนดให้ function ทำงานเมื่อ select ได้รับ focus

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.onfocus = function()
    {
         alert ( "select gain focus" );
    }

  • property :
    onblur = function;

    return type :
    void

    content :
    ใช้กำหนดให้ function ทำงานเมื่อ select สูญเสีย focus

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.onblur = function()
    {
         alert ( "select loss focus" );
    }

  • property :
    onclick = function;

    return type :
    void

    content :
    ใช้กำหนดให้ function ทำงานเมื่อ select ถูก click

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.onclick = function()
    {
         alert ( "select be clicked" );
    }

  • property :
    onchange = function;

    return type :
    void

    content :
    ใช้กำหนดให้ function ทำงานเมื่อ select มีการเปลี่ยนแปลง

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    tagSelect.onchange = function()
    {
         alert ( "select be changed" );
    }

  • property :
    index;

    return type :
    number

    object :
    option

    content :
    ใช้คืนค่าลำดับที่ ( index ) ของ option

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    for ( var i=0; i<tagSelect.length; i++ )
    {
    	alert ( tagSelect.options.item(i).index );
    }

  • property :
    text;

    return type :
    string

    object :
    option

    content :
    ใช้คืนค่า ข้อความ ของ option

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    for ( var i=0; i<tagSelect.length; i++ )
    {
    	alert ( tagSelect.options.item(i).text );
    }

  • property :
    value;

    return type :
    string

    object :
    option

    content :
    ใช้คืนค่า value ของ option

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    for ( var i=0; i<tagSelect.length; i++ )
    {
    	alert ( tagSelect.options.item(i).value );
    }

  • property :
    selected;

    return type :
    boolean

    object :
    option

    content :
    ใช้คืนค่า เพื่อตรวจสอบว่า option นี้ถูกเลือกอยู่หรือไม่

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    for ( var i=0; i<tagSelect.length; i++ )
    {
    	if ( tagSelect.options.item(i).selected )
    	{
    		alert ( tagSelect.options.item(i).text );
    	}
    }

  • property :
    defaultSelected;

    return type :
    boolean

    object :
    option

    content :
    ใช้คืนค่า เพื่อตรวจสอบว่า option นี้ถูกเลือกไว้ตั้งแต่ต้นหรือไม่

    example :
    var tagSelect = document.getElementById ( "bamboo" );
    for ( var i=0; i<tagSelect.length; i++ )
    {
    	if ( tagSelect.options.item(i).defaultSelected )
    	{
    		alert ( tagSelect.options.item(i).text );
    	}
    }

 
Share This Chapter Login with Facebook