HTML5의 DataList에 선택한 옵션 옵션 후 트리거 이벤트

참고 블로그 :   https://blog.csdn.net/qishuixian/article/details/78427951

DataList에에서 HTML5의 가장 최근의 사용은 옵션 선택한 옵션에 해당하는 속성 값을 얻는다. 

<! DOCTYPE HTML > 
< HTML > 
< > 
< 스크립트 SRC = "./ JQuery와-1.7.2.min.js" 유형 = "텍스트 / 자바 스크립트" 문자 집합 = "UTF-8" > </ 스크립트 > 
< 스크립트 유형 = " 텍스트 / 자바 스크립트 " > 
기능 inputSelect () {
     var에 input_select = $ ( " #INPUT " ) .val ();
    VAR option_length = $ ( " 옵션 " ) .length;
    ;
    위한 ( VAR I = 0 ; I는 < option_length 단계; 내가 ++ ) {
         VAR option_value = $ ( " 선택 " ) .EQ (I) .attr ( " 데이터 값 " );
        경우 (input_select == option_value) { 
            option_id = $ ( " 선택 " ) .EQ (I) .attr ( " 데이터 ID ' );
            휴식 ; 
        }  
    }
    CONSOLE.LOG (input_select, option_length, option_id); 
};
</ 스크립트 > 
< 입력 리스트 = "차"   ID = "입력" 의 onchange = "inputSelect ()" /> 
< DataList에 ID = "차" > 
    < 옵션 = "111" 의 데이터 값 = "111"   의 데이터 ID = "1" > 
    < 옵션 = "122"   의 데이터 값 = "122" 의 데이터 ID = "2" > 
    < 옵션 = "1222" 의 데이터 값 = "1222"데이터 ID = "4" > 
</ DataList에 >
 </ 바디 > 
</ HTML > 

<! - 선택된 옵션의 값이, 입력 표시하고 해당 속성 데이터 ID를 취득 ->

 

추천

출처www.cnblogs.com/xumBlog/p/10931989.html