이 기사는 일반적으로 다양한 형태, 링크 및 버튼을 처리합니다. JavaScript 양식 처리를 작동하는 방법을 가르쳐줍니다. 특정 내용은 다음과 같습니다
/** * 일반 양식 처리 js * @author anthony.chen *//** * 푸시 버튼 조치 [btn_Action] 데이터 양식 * 처방전이있는 경우 사전 스크립트를 실행하는 경우 */"Strict 사용"; // 모든 AJAX 요청이 기본적으로 AjaxSynchronized = true; // ajax ajax에 의해 동기화됩니다. var ajax_action_button = function (e) {var btn = $ (this); // 처방전 var pre_script 추가; if (pre_script = btn.attr ( "pre_script")) {var ret = atal (pre_script); if (ret == false) {return false; }} var btn_action = btn.attr ( 'value'); if (btn_Action) {$ (this) .Closest ( 'form'). data ( 'btn_Action', {이름 : 'btn_Action', value : btn_Action}); }}; /** * 형식 요소, 키 및 값으로 추가 양식 데이터를 업데이트 */var ajax_update_post_data = function (formele, k, v) {var form = $ (formele); var post_data = form.data ( 'post_data'); if (post_data == undefined) {post_data = {}; } if (v == undefined) {delete post_data [k]; } else {post_data [k] = v; } form.data ( 'post_data', post_data); 진실을 반환하십시오;}; /** * bool checkbox는 값을 선택 해제하고 ajax 양식으로 게시 해야하는 특수 확인란입니다. 양식은 부모에 있습니다 */var bool_checkbox = function () {var ipt = $ (this); var formele = ipt.closest ( "form"); var _check = ipt.prop ( "확인"); if (_check) {ajax_update_post_data (formele, ipt.attr ( 'name')); } else {ajax_update_post_data (formele, ipt.attr ( 'name'), 'f'); }}; /** * 스핀 번호 */var spin_number = function () {var spin = $ (this); var config = {lock : true, imagebasepath : '{webpath}/css/images/spin/', btncss : null, txtcss : null, btnclass : 'spin_btn',}; var interval = spin.attr ( 'interval'); if (interval) {config.interval = 간격; } else {config.interVal = 1; } var min = spin.attr ( 'min'); if (min) {config.min = min; } var max = spin.attr ( 'max'); if (max) {config.max = max; } spin.spin (config); 진실을 반환하십시오;}; /** * 날짜 입력을 시작 */var date_input = function () {var ipt = $ (this); var config = {오프셋 : [4,0], selectors : true, lang : '{lang}', FirstDay : 1, 형식 : 'yyyy-mm-dd',}; var min = ipt.attr ( 'min'); if (min) {config.min = min; } ipt.DateInput (config); 진실을 반환하십시오;}; /** * TimePicker */var time_picker = function () {var ipt = $ (this); var config = {}; var step = ipt.attr ( "단계"); if (step) {config.step = step; } ipt.timepicker (config); 진실을 반환하십시오;}; /** * 일반 ajax 양식 포스트 함수 * BTN_Action이 설정된 경우 양식에 데이터를 추가 * returi가 설정되면 RETURI를 설정하면 RELOAD가 설정되면 Reload *를 표시합니다. */var ajax_form_post = function (e) {var form = $ (this); var pre_script; if (pre_script = form.attr ( "pre_script")) {var ret = atal (pre_script); if (ret == false) {return false; }} var errhint = form.find ( ". formerror"). first (); if (errhint.size () == 0) {errhint = $ ( "#pageError"); } errhint.text ( ''). hide (); // pageError를 정리 if (! e.isdefaultPrevented ()) {// 모든 것을 숨 깁니다. formerror $ .Blockui ({메시지 : "{__ ( 'l_processing')}"}); var formarray = form.serializearray (); var btn_action_data; var btn_Action; if (btn_action_data = form.data ( 'btn_action')) {formarray.push (btn_action_data); form.removedata ( 'btn_action'); btn_action = btn_action_data.value; } else {btn_action = ''; } console.log ( 'btn action :'+btn_action); // 추가 데이터 추가 var var post_data; if (post_data = form.data ( 'post_data'))) {for (post_data의 var k) {// post_data [k]가 배열 인 경우, formarray.push ({name : k, value : post_data [k]}); } form.removedata ( 'post_data'); } $ .post (form.attr ( 'action'), formarray, function (json) {if ($ (창) .data ( 'blockui.isblocked') == 1) {$ .unblockui ();} if (json.code === true) {var returi = ""; var retdata = " if (json.data) {retdata = json.data; 메시지 : CSS : {커서 : '포인터', 패딩 : '4px', 국경 : '3px solid #cc0000',}, {커서 : '포인터'}) ( ". blockui"); 폼 (json.data.errmsg) == 'string') {errhint.html (json.data) .show (); {메시지 : json.data, css : {cursor : '4px', border : '3px solid #cc00000', 오버레이, }; 숨겨진 값을 참조하십시오. // ref var ele = form.find에 서버 메시지를 표시합니다. "[name ="+p+"]"{json.data.p 삭제; json.data [refname]} muti checkbox.find 숨겨진 값 */ form.data ( "validator"). 무효 (json.data), 'JSON'); e.preventDefault (); } else {errhint.html ( "{html :: text (__ ( 'e_form'))}"). show (); }}; /****입력을 재설정*/var ajax_post_form_hidden = function () {var form = $ (this); form.find ( "[Hidden-id]" "). 각 (function () {// 참조 var input = $ (this); var refid = input.attr ("hidden-id "); var field = $ ("#" + refid +" "); // eRMSG // 실제 오류 메시지를 제거하는 eRMSG // intuples (var field = $ ("hidden-id "); var field = $ ("#" + refid +" "); var hinput = $ (this); }); var validate_hidden_id = function (input) {var refid = input.attr ( "hidden-id"); var field = $ ( "#" + refid + ""); var msg = field.attr ( 'msg'); if (! msg) {msg = "{__ ( 'e_not_empty')}"; } return field.val ()? 사실 : MSG; }; var data_equals_validate = function (입력) {var 필드; var name = input.attr ( "data-equals"); field = this.getInputs (). 필터 ( "[name =" + name + "]"); return input.val () == field.val ()? 참 : [이름];}; /** * 링크를 통한 ajax 요청 * 확인이 설정되면 확인하기 전에 확인 * 보내기 요청 및 다시로드 * 다른 블록 메시지 표시 */var ajax_link_req = function () {var l = $ (this); var hint = l.attr ( 'hint'); if (hint) {var errhint = $ (l.attr ( 'hint')); errhint.text ( ''). hide (); } // 확인 메시지가 설정된 경우 클라이언트에서 확인해야합니다. if (l.attr ( 'conficate')))) {if (! 확인 (l.attr ( 'volict'))) {return false; }} $ .Blockui ({메시지 : "{__ ( 'l_processing')}"}); var pre_script; if (pre_script = l.attr ( "pre_script")) {var ret = atal (pre_script); if (ret == false) {return false; }} var block = l.attr ( 'block'); if (block! = undefined) {ajaxautounblock = false; } $ .get (l.attr ( 'href'), function (json) {if (json.code == true) {var retdata = "{__ ( 'l_processed')}!"; var returi; // 각 varconcefunc = l.attr ( 'success')에 대해 기능을 실행하려는 성공. if (json.data) {retdata = json.data}. Window.loction.reload (); } else {// unblockui (); 거짓을 반환;}; /** * 버튼 기본 탐색 지원 * 새로운 href로만 점프 */var btn_nav = function () {var input = $ (this); var href = input.attr ( "href"); if (href) {window.location = href; } else {alert ( "href not set"); } return false;}; /** * 지원 버튼 기반 Ajax 메서드 요청 받기 * 지원 반환 및 다시로드 */var btn_req = function () {var input = $ (this); var href = input.attr ( "href"); var hint = input.attr ( 'hint'); if (hint) {var errhint = $ (hint) .first (); if (errhint.size () == 0) {errhint = $ ( "#pageError"); } errhint.text ( ''). hide (); } var block = input.attr ( 'block'); if (block! = undefined) {ajaxautounBlock = false} $ .get (href, function (json) {if (json.code == true) {var returi; if (returi = input.attr ( 'returi')) {window.location = returi;} else ( "input.attr (reeload") {reeload ") window.reload (); } else {hint) {$ .unblockui (); html (json.data.errmsg). 오버레이 즈 : {커서 : '포인터'}); addClass ( "blockwarn"); 거짓을 반환;}; /** * 일반 ajax 확인란 * 기본 조치가 방지 및 URL을 통해 실제 요청을 제출하고 제출합니다. */var ajax_checkbox = function () {event.preventDefault (); var action = $ (this); var url = action.attr ( 'url'); var _check = action.prop ( "확인"); Console.log (_check); var op; if (_check) {op = "1"; } else {op = "0"; } $ .get (url + op, function (json) {if (json.code == true) {if (_check) {action.prop ( "checked", true);} else {action.prop ( "checked", false);} return true;} else {return false;}}, 'json'); /** * Crete Root Picklist */var picklistinit = function () {var _select = $ (this); var _hidden_id = _select.attr ( 'hidden-id'); var _un = _select.attr ( 'un'); var _lovchildren = _select.data ( 'lovtree'). c; var _rowvalue = _select.data ( 'rowvalue'); $ ( "<pection>"). Append ( "{__ ( 'l_select')}"). 부록 (_select); for (var _kid in _lovchildren) {var _lov = _lovchildren [_kid] [ 'lov']; $ ( "<pection>"). val (_lov.lov_id) .append (_lov.v) .attr ( 'k', _ lov.id) .attr ( 'is_leaf', _ lov.is_leaf) .appendto (_select); } _select.change (picklistchange); // if (_rowValue) {_select.find ( "[value ="+_ rowvalue [0]+"]"). prop ( "selected", true); _select.change (); } return true;}; /** * 선택 목록 선택 */var picklistchange = function () {var _select = $ (this); var _hidden_id = _select.attr ( 'hidden-id'); var _un = _select.attr ( 'un'); // 모든 후속 var _lovtree = _select.data ( 'lovtree')를 제거합니다. var _rowvalue = _select.data ( 'rowvalue'); _select.nextall (). remove (); // 이것은 현재의 값입니다. select var _Select = _select.Find ( ': selected'); if (_selected.attr ( 'is_leaf') == "{db :: t}") {$ ( "#"+_ hidden_id) .val (_select.val ()); _select.after ( "<img src = '/s.gif'class = 'sprite_global constructImg'/>"); } else {var _val = _select.val (); var _k = _selected.attr ( 'k'); // if (_lovtree.c [_k] .c == undefined) {return false; } var _c_lovtree = _lovtree.c [_k]; var _c_select = $ ( '<select>'). data ( 'lovtree', _ c_lovtree). 데이터 ( 'rowvalue', _ rowvalue). attr ( 'hidden-id', _ hidden_id) .attr ( 'un', _ un). attr ( 'name', _ un+'_'+_ k); $ ( "<pection>"). Append ( "{__ ( 'l_select')}"). 부록 (_c_select); // (_c_lovtree.c의 var _kid) {var _kid {var _lov = _c_lovtree.c [_kid] [ 'lov']; $ ( "<pection>"). val (_lov.lov_id) .append (_lov.v) .attr ( 'k', _ lov.id) .attr ( 'is_leaf', _ lov.is_leaf) .appendto (_c_select); // _Select.After (_c_Select) 이후에 삽입; // onchange} _c_select.change (picklistchange); if (_rowvalue) {_c_select.find ( "[value ="+_ rowvalue [_k]+"]"). prop ( "selected", true); _c_select.change (); }}}; var Xookup_new = function () {var Xookup = $ (this); var pre_script; if (pre_script = lookup.attr ( "pre_script")) {var ret = atal (pre_script); if (ret == false) {return false; }} var url = lookup.attr ( "url"); if (! url) {alert ( 'url not set'); 거짓을 반환합니다. } var height = lookup.attr ( 'h'); if (! 높이) {높이 = 600; } var width = lookup.attr ( 'w'); if (! 너비) {너비 = 800; } window.open (url, "pselect", "scrollbars = yes, menubar = no, height ="+height+", width ="+width+", resizable = yes, toolbar = no, location = no, status = no"); 거짓을 반환합니다. }; /** * 숨겨진 값에 대한 새 값 조회 */var parent_lookup = function () {var Xookup = $ (this); var pid = 오프너. $ ( "#" + Xookup.attr ( 'pid')); if (! pid.length) {alert (lookup.attr ( 'pid')+ "찾기 없음"); 거짓을 반환합니다. } var pname = Opener. $ ( "#" + Xookup.attr ( 'pname')); if (! pname.length) {alert (lookup.attr ( 'pname')+ "찾기 없음"); 거짓을 반환합니다. } var aft_script; // 스크립트 이후에 현재 실행 if if (aft_script = lookup.attr ( 'aft_script')) {window.eval (aft_script); } pid.val ($ (this) .attr ( "refid")); // 오프너에서 만 작동 만 변경할 수 있습니다. 이벤트 변경 PID.CHANGE (); pname.val ($ (this) .attr ( "refvalue")); pname.change (); // parent after_script if (aft_script = pname.attr ( 'aft_script')) {opener.window.eval (aft_script); } if (aft_script = pid.attr ( 'aft_script')) {opener.window.eval (aft_script); } window.close ();}; /** * 기본 업로드 완료 * /// var upload complete = function (event, id, filename, responsejson) {var upload complete = function (e, data) {// jQuery Uploader var _fileUpload = $ (this); //console.log(_fileupload); //console.log(data.result); if (_fileupload.attr ( 'repoad')! = undefined) {window.location.reload (); }}; /** * 파일 업로드 함수, 업로드 동작을 제어하기위한 다음 속성 * 'endpoint'는 URL * 'sid'세션 ID로 URL * 'sid'옵션을 구성하기위한 옵션 완료 */var genericUpload = function (dom) {var endpointUrl = $ (this) .attr ( 'endpoint'); var sid = $ (this) .attr ( "sid"); var sid = $ (this) .attr ( "sid"); var completeFunc = '업로드 컴퓨터'; // 설정 사용자 정의 완료 함수 var cuscomplete = $ (this) .attr ( 'complete'); if (cuscomplete) {completefunc = cuscomplete; } $ (this) .fileUpload ({url : endpointurl, autoupload : true, datatype : 'json', formdata : [{ 'sessionid': sid}], paramname : 'filedata',}). bind ( 'fileUploaddone', Window [winder [});}; /** * 입력이있는 일치 오류 * 여기에서 일치하는 오류 만 식별 할 수 있습니다 */var Advance_validate = 함수 (오류, 이벤트) {var conf = this.getConf (); // 루프 오류 $ .Each (오류, 함수 (인덱스, 오류) {// 입력에 오류 클래스 추가 var var input = error.input; addclass (conf.errorclass); // hant var var msg = input.data ( "msg.el"); // intrest/ "msg에 대한 오류 클래스를 추가합니다. (! msg.css ({가시성 : 'hidden'}). ( "span"). remove (); == msg.parent () {msg.find ( "span"); var Advance_Inputs = function (입력) {var conf = this.getConf (); inputs.removeclass (conf.errorclass) .Each (function () {var msg = $ (this) .data ( "msg.el"); if (msg) {msg) {msg) {msg) if ($ ( ". colerror"). size () == 0) {var form = $ (this); var errhint = form.find ( ". formerror"). first (); if (errhint.size () == 0) {errhint = $ ( "#pageError"); errhint.text ( ''). hide (); }}}; /** * refname이 선택하도록 포함 된 경우 */var checkall = function () {var check = $ (this); var refname = check.attr ( 'refname'); if (refname) {if (check.prop ( "checked")) {$ ( "input [name*= '+refname+"']). prop ( "checked", true); } else {$ ( "입력 [이름*= '"+refname+"']"). prop ( "Checked", false); }} var refclass = check.attr ( 'refclass'); if (refclass) {if (check.prop ( "checked")) {$ ( "input."+refclass) .prop ( "Checked", true); } else {$ ( "input."+refclass) .prop ( "Checked", false); }}}; /** * 설정 readOnly checkbox */var readOnlyCheck = function (e) {e.preventDefault (); 거짓을 반환;}; /** * 목록 선택 */var readOnlySelect = function () {$ (this) .prop ( "disabled", true); }; $ (document) .ready (function () {$ (document) .ajaxStart (function () {// ajax 요청 페이지 레벨 오류 정리 ( "#pageError"). text ( ''). $ .Blockui ({__ ( 'l_processing')}}); ajaxStop (function (ajaxsynchronized) {if ($ (window) .data ( 'blockui.isblocked') {ajax aoutlock. } else {ajaxsynchronized = true에서 기본 동기화 모드로 다시 변경합니다. if (ajaxsynchronized) {$ (window) unblockui $ (document) .click (function () {if ($ (wind $ .tools.validator.addeffect ( "Advanced", Advance_Validate, Advance_inputs); $ .tools.Validator.fn ( "[Hidden-id]", validate_hidden_id); $ (ajax_form_post ". // 숨겨진 ID $에 대한 클라이언트 유효성 검사 ( ". Quession_Validate"). validator ({lang} ', effect :'advanced '}); $ ( "button.btn_Action". (AJAX_ACTION_BUTTON); ". lookup_new"; $ ( "checkall"). "{__ ( 'e_email')}", ':': number ': "{__ ('e_decimal ')}",': url ': "{__ ('e_url ')}",'[max] ': "{__ ('e_max_length ')}",'[min] '': "__ __ ( 'e_min _,', '[필수]': "{__ ( 'e_not_empty')}",});});위는이 기사의 모든 내용입니다. 모든 사람이 JavaScript Form 프로세싱 작업을 마스터하는 것이 도움이되기를 바랍니다. 읽어 주셔서 감사합니다.