JQuery 비동기 로딩 무한 드롭다운 상자 계단식 함수 구현 example_jquery

코드 복사 코드는 다음과 같습니다.

/* <br>JQuery는 무한 드롭다운 상자 캐스케이드 함수 <br>zjy <br>*/ <br>(function ($) { <br>를 비동기적으로 로드합니다. $.ajaxSetup( { async: false }); <br>var url = ""; <br>var 매개변수 = ""; <br>$.fn.extend({ <br>로드: 함수(urlPath) 🎜>url = urlPath.url; <br>parameter = urlPath.parameter; <br>$("#ddl1").append("<option value='0'selected='selected'>선택하세요</ option>" ); <br>$.getJSON(url, 매개변수, 함수(데이터) { <br>$.each(data.rows, 함수(i, 행) { <br>$("#ddl1"). Append($ ("<option></option>").val(row.id).html(row.text)) <br>}); (function ( ) { $(this).Select($(this).val(), this); }) <br>$(this).Selected(parameter.parentId, $(" #ddl1" )); <br>}, <br><br>선택: function (parentId, obj) { <br>//debugger; <br>if (parentId == "0") { <br>return ; <br>} <br>parameter.parentId = parentId; <br>$.getJSON(url, 매개변수, function (data) { <br>$(obj).nextAll(".ddl").remove(); <br> if (data != null) { <br>$("<select>", { <br>"class": "ddl", <br>change: function () { <br>$(this ).Select ($(this).val(), this); <br>} <br>}).appendTo($("#cascade")) <br><br>$($(".ddl ")[ $(".ddl").length - 1]).append("<옵션 값='0' selected='selected'>선택하세요</option>"); <br>$.each (데이터 .rows, 함수 (i, 행) { <br>$($(".ddl")[$(".ddl").length - 1]).append($("<option>< /option&gt ;").val(row.id).html(row.text)); <br>}); <BR>} <BR>}); <BR>$(this).Selected(parentId, $ (obj ).nextAll(".ddl")); <BR>}, <BR><BR>선택됨: function (parentId, obj) { <BR>$(this).GetValue() <br>// debugger; <br>var selected = "0," $("#loadselect").val() <BR>$.each(selected.split(","), function (i, row) { <BR> if ( row == parentId) { <BR>//debugger; <BR>$(obj).val(selected.split(",")[i 1]) <BR>$(obj).change() ; <BR>} <BR>}); <BR>}, <BR><BR>GetValue: function () { <BR>var ddlValue <br>var ddlCount = $(".ddl").length; <br>for (var i = ddlCount - 1; i >= 0; i--) { <br>if (i != 0) { <br>if ($($(".ddl")[i ]) .val() != 0) { <br>ddlValue = $($(".ddl")[i]).val() <br>break; <br>} <br>} else { <br> if ($($(".ddl")[i]).val() == 0) { <br>ddlValue = 0 <br>break <br>} else { <br>ddlValue = $ ($ (".ddl")[i]).val(); <br>break; <br>} <br>} <br>} <br>$("#selectvalue").val(ddlValue); <br>}, <br>}) <br>})(jQuery) <br>

<pre code_snippet_id="193059" snippet_file_name="blog_20140218_1_1038704" name="code" class="javascript">

호출 방법

< pre code_snippet_id="193059" snippet_file_name="blog_20140218_4_4987391" name="code" class="javascript">

 <br>$(function () { <br>$("#cascade").Load({ url: '@Url.Action("GetCountryArea")', 매개변수 : { "parentId": 0, "random": Math.random() } }) <br></script>

<div id="cascade"> <br><select id="ddl1" class="ddl"> < /select> <br></div> <br><input id="loadselect" Hidden="hidden" value="1,2"/><br><input id="selectvalue" Hidden= "숨겨짐" />

>사전>
사전>