이 글은 easyUI 드롭다운 목록 클릭 이벤트를 주로 사용하는 방법을 자세히 소개합니다. 관심 있는 친구들이 참고하면 도움이 될 것입니다.
이 글의 예시는 참고용으로 easyUI 드롭다운 목록 클릭 이벤트를 사용하는 방법을 공유합니다. 구체적인 내용은 다음과 같습니다
드롭다운 목록은 input 및 select
을 통해 생성할 수 있습니다. select는 다음과 같이 생성됩니다.
js 배열을 생성하려면 json을 전달하세요.
[{ "id":1, "text":"text1" },{ "id":2, "text":"text2" },{ "id":3, "text":"text3", "selected":true },{ "id":4, "text":"text4" },{ "id":5, "text":"text5" }]
예:
html 코드 조각:
<select id="in_edit_netlink" style="width:160px;" class="easyui-combobox" data-options="valueField:'id',textField:'text',editable:false" > </select>
js 코드 조각:
var ljfsArray = new Array(); var objHTTP = new Object(); objHTTP.text = "HTTP"; var objTCP = new Object(); objTCP.text = "TCP"; objTCP.id = 1; objHTTP.id = 2; if (data.ljfs == "HTTP") { objHTTP.selected=true; } else { objTCP.selected=true; } ljfsArray.push(objHTTP); ljfsArray.push(objTCP); $('#in_edit_netlink').combobox('loadData', ljfsArray);
페이지 효과 디스플레이:
속성 설명:
valueField :'id'---objTCP.id--->옵션 값 value
textField:'text'---objTCP.text--->페이지 표시 값
objTCP .selected=true; ---> 기본 표시는
클릭 수정 이벤트
onSelect는 onChange
와 동일하지만 문제는 onChange가 easyUI에서 지원되지 않고 onSelect가 html에서 지원되지 않는다는 것입니다.
onSelect는 js 코드에서 사용해야 합니다.
$("#in_edit_netlink").combobox({ onSelect: function () { connectionType = $('#in_edit_netlink').val(); if (connectionType == 1) { $('#in_edit_sjjh').textbox('setValue', tcpIp); } else { $('#in_edit_sjjh').textbox('setValue', httpIp); } } })
사용
$(function () { })
기본적으로 로드한 후 onSelect 이벤트를 정상적으로 사용할 수 있습니다.
관련 권장 사항:
시작 날짜가 인스턴스 공유 종료 시간보다 작은 EasyUI Datebox 날짜 확인
easyUI 드래그 작업에서 놓기 및 끌기 가능 사용 예
인라인 편집 예에 대한 자세한 설명 EasyUI의 dataGrid
위 내용은 EasyUI 드롭다운 목록 클릭 이벤트 사용 예시 공유의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!