Эта статья обрабатывает различные формы, ссылки и кнопки в целом. Он учит вас, как управлять обработкой формы JavaScript. Конкретный контент заключается в следующем
/** * Общая обработка формы js * @author anthony.chen *//** * Действие кнопки [btn_action] в форму * Если есть предписание, запустите предварительный скрипт */«Использовать строгое»; // Все запросы ajax синхронизированы по умолчанию ajaxsynchronized = true; // All Ajax -запрос будет Unblock by ucaxsynchronized = true; // ajax -запрос будет Unblock by ucaxsynchronized = // ajax -repring by defaullock ajaxsynchronize = // ajax u -jax -ajax var ajax_action_button = function (e) {var btn = $ (this); // Добавить предписание var pre_script; if (pre_script = btn.attr ("pre_script")) {var ret = eval (pre_script); if (ret == false) {вернуть false; }} var btn_action = btn.attr ('value'); if (btn_action) {$ (this) .closest ('form'). data ('btn_action', {name: '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); вернуть true;}; /** * Флажок Bool - это специальный флажок, который должен сохранить значение без контроля * и post с формой 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'); }}; /** * init the Spin Number */var spin_number = function () {var spin = $ (this); var config = {lock: true, imagebasepath: '{webpath}/css/image/spin/', btncss: null, txtcss: null, btnclass: 'spin_btn',}; var интервал = spin.attr ('интервал'); if (интервал) {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); вернуть true;}; /** * init the Date Input */var date_input = function () {var ipt = $ (this); var config = {offset: [4,0], селекторы: true, lang: '{lang}', первый день: 1, формат: 'yyyy-mm-dd',}; var min = ipt.attr ('min'); if (min) {config.min = min; } ipt.dateinput (config); вернуть true;}; /** * init the timepicker */var time_picker = function () {var ipt = $ (this); var config = {}; var step = ipt.attr ("step"); if (step) {config.step = step; } ipt.timepicker (config); вернуть true;}; /** * Generic Ajax Form Function Function * Если установлен BTN_Action, добавьте данные в форму * Если установлен returi, перенаправить для возврата * Если установлен перезагрузка, перезагрузить * иначе Показать сообщение блока * * Форма будет подтверждена. */var ajax_form_post = function (e) {var form = $ (this); var pre_script; if (pre_script = form.attr ("pre_script")) {var ret = eval (pre_script); if (ret == false) {вернуть false; }} var errhint = form.find (". FormError"). First (); if (errhint.size () == 0) {errhint = $ ("#pageerror"); } errhint.text (''). hide (); // Очистить Pageerror if (! E.isdefaultprevented ()) {// скрыть все .formerror $ .blockui ({message: "{__ ('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.removatata ('btn_action'); btn_action = btn_action_data.value; } else {btn_action = ''; } console.log ('btn action:'+btn_action); // Добавить дополнительные данные var post_data; if (post_data = form.data ('post_data')) {for (var k in post_data) {// if post_data [k] - массив, нужно больше, чтобы сделать formarray.push ({name: k, value: post_data [k]}); } form.Removedata ('post_data'); } $ .post (form.attr ('action'), formarray, function (json) {if ($ (window) .data ('blockui.isblocked') == 1) {$ .unblockui ();} if (json.code === true) {var returi = ""; if (json.data) {retdata = json.data; $ .blockui ({Сообщение: Retdata, CSS: {Cursor: 'Pointer', Padding: '4px', граница: '3px solid #cc0000',}, vallaycss: {cursor: 'pointer'}}); if (returi = form.attr ('returi') {window.location = returi; if (typeof (json.data.errmsg) == 'string') {errhint.html (json.data) .show (); Курсор: «Показатель»}); Значение, не скрытый вход должен быть упомянут в скрытом значении // Показывание сообщения сервера в ref -var = form.find ("[type = hidden] [name ="+p+"]"); form.find ("[hidden-id ="+refid+"]"). ATTR ("name"); json.data [refname] =+msg; 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 + ""); // Настройка Clear of Errmsg // Мониторинг Envent on ID ID, удалить сообщение об ошибке // really (//-field. hinput = $ (это); }); 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 (input) {var field; var name = input.attr ("data-equals"); field = this.getInputs (). Filter ("[name =" + name + "]"); return input.val () == field.val ()? true: [name];}; /** * ajax запрос через ссылку * Если подтвержден, подтвердите, подтвердите перед отправкой запрос * Поддержка возврата и перезагрузки * else Показать сообщение блока */var ajax_link_req = function () {var l = $ (this); var Hint = l.Attr ('ntic'); if (int) {var errhint = $ (l.Attr ('ntic')); errhint.text (''). hide (); } // Если установлено подтверждение сообщения, то следует подтвердить от клиента if (l.attr ('inform')) {if (! Anform (l.Attr ('inform'))) {return false; }} $ .blockui ({message: "{__ ('l_processing')}"}); var pre_script; if (pre_script = l.attr ("pre_script")) {var ret = eval (pre_script); if (ret == false) {вернуть false; }} var block = l.attr ('block'); if (block! = undefined) {ajaxautounblock = false; } $ .get (l.attr ('href'), function (json) {if (json.code == true) {var retdata = "{__ ('l_procaved')}!"; var returi; // Если успех выполнить функцию для каждого var uccess = l.attr ('success'); if succestfunc) if (json.data) {retdata = json.data; window.location.reload (); } else {// $. unblockui (); вернуть false;}; /** * Поддержка базовой навигации кнопки * Только перейти к новому href */var btn_nav = function () {var input = $ (this); var href = input.attr ("href"); if (href) {window.location = href; } else {alert ("href не установлен"); } вернуть false;}; /** * Кнопка поддержки База AJAX GET Метод запрос * Поддержка возврата и перезагрузки */var btn_req = function () {var input = $ (this); var href = input.attr ("href"); var Hint = input.Attr ('ntice'); if (int) {var errhint = $ (int) .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 if (input.attr ("reluri ')) {window.location = returi;} ense if (input.attr (" reluret')) window.location.reload (); }); #Cc0000 ',}, vollaycss: {cursor:' pointer '}}); вернуть false;}; /** * Общий флажок Ajax * Действие по умолчанию предотвращено и отправляется реальным запросом через URL */var ajax_checkbox = function () {event.preventdefault (); var action = $ (это); var url = action.attr ('url'); var _check = action.prop ("cherced"); 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 ("cherced", true);} else {action.prop ("cherced", false);} return true;} else {return false;}}, 'json');};}; /** * КРЕТНЫЙ РУКОВОЙ ПИТАЛ */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'); $ ("<ploict>"). Append ("{__ ('L_Select')}"). AppendTo (_Select); for (var _kid в _lovchildren) {var _lov = _lovchildren [_kid] ['lov']; $ ("<ploict>"). 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 (); } вернуть 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 (); // это значение текущего выбора var _selected = _select.find (': selected'); if (_selected.attr ('is_Leaf') == "{db :: t}") {$ ("#"+_ hidden_id) .val (_select.val ()); _Select.after ("<img src = '/s.gif' class = 'sprite_global sucksimg'/>"); } 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). DATA ('ROWVALUE', _ ROWVALUE). attr ('hidden-id', _ hidden_id) .attr ('un', _ un). attr ('name', _ un+'_'+_ k); $ ("<ploict>"). Append ("{__ ('l_select')}"). AppendTo (_C_SELECT); // Создание списка опций для (var _kid в _c_lovtree.c) {var _lov = _c_lovtree.c [_kid] ['lov']; $ ("<ploict>"). 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 lookup_new = function () {var lookup = $ (this); var pre_script; if (pre_script = lookup.attr ("pre_script")) {var ret = eval (pre_script); if (ret == false) {вернуть false; }} var url = lookup.attr ("url"); if (! url) {alert ('url не установлен'); вернуть ложь; } var height = lookup.attr ('h'); if (! Высота) {высота = 600; } var width = lookup.attr ('w'); if (! ширина) {ширина = 800; } window.open (url, "psectect", "scrollbars = yes, menubar = no, height ="+height+", width ="+width+", resizable = yes, wbar = no, location = no, nate = no"); вернуть ложь; }; /** * Поиск новое значение для скрытого значения */var parent_lookup = function () {var lookup = $ (this); var pid = oppler. $ ("#" + lookup.attr ('pid')); if (! pid.length) {alert (lookup.attr ('pid')+ "не найден"); вернуть ложь; } var pname = opener. $ ("#" + lookup.attr ('pname')); if (! pname.length) {alert (lookup.attr ('pname')+ "не найден"); вернуть ложь; } var aft_script; // запустить ток после скрипта if (aft_script = lookup.attr ('aft_script')) {window.eval (aft_script); } pid.val ($ (this) .attr ("refic")); // только операция от открытия может вызвать изменение события pid.change (); pname.val ($ (this) .attr ("refvalue")); pname.change (); // родительский adper_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 oploadcomplete = function (event, id, имя файла, responsejson) {var oploadcomplete = function (e, data) {// для замены jQuery ulloader var _fileUpload = $ (this); //console.log(_fileupload); //console.log(data.result); if (_fileupload.attr ('reload')! = undefined) {window.location.reload (); }}; /** * Функция загрузки файла, следующее атрибут для управления действием opload * 'endpoint' как URL загрузки * 'SID' идентификатор сеанса * 'Полный' Необязательно для настройки пользовательской функции загрузки */var genericUpload = function (dom) {var endPointUrl = $ (this) .attr ('endpoint'); var sid = $ (this) .attr ("sid"); var sid = $ (this) .attr ("sid"); var foodfunc = 'uploadcomplete'; // настроить пользовательскую полную функцию var cuscomplete = $ (this) .attr ('ulep'); if (cuscomplete) {worthfunc = cuscomplete; } $. /** * Соответствующие ошибки с вводом * только сопоставленные ошибки могут быть идентифицированы здесь */var advance_validate = function (ошибки, событие) {var conf = this.getConf (); // Ошибки цикла $. (! Msg) {// msg = $ (conf.message) .AdDClass (conf.messageclass) .InserTafter (input); 'Hidden'}). Найдите ("span"). Remove (); msg.parent (). var Advance_Inputs = function (inputs) {var conf = this.getConf (); inputs.RemoveClass (conf.errorClass) .ireck (function () {var msg = $ (this) .data ("msg.el"); if (msg) {msg.hide (); msg.parent (). removeclass ("colerror");}}); 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 ("cherced")) {$ ("input [name*= '"+refname+"']").). Prop ("cherced", true); } else {$ ("input [name*= '"+refname+"']"). prop ("cherced", false); }} var refclass = check.attr ('refclass'); if (refclass) {if (check.prop ("cherced")) {$ ("input."+refclass) .prop ("cherced", true); } else {$ ("input."+refclass) .prop ("cherced", false); }}}; /** * Настройка проверки чтения */var readonlycheck = function (e) {e.preventDefault (); вернуть false;}; /** * Выберите список отключить */var readonlect = function () {$ (this) .prop ("disablet", true); }; $ (document) .ready (function () {$ (document) .ajaxstart (function () {// Очистить ошибку уровня страницы запроса Ajax $ ("#pageerror"). Text (''). Head (); // Очистить ошибку формы $ (".. FormError"). $ .blockui ({Сообщение: "{__ ('l_processing')}"}); $ .unblockui (); Url = '+setusts.url); ajaxsynchronized = true; }}}); $ .tools.validator.fn ("[hidden-id]", validate_hidden_id); $ (. Ajax_form_post "). // Валидация клиента для скрытого идентификатора $ (". Require_validate"). Validator ({lang: '{lang}', эффект: 'Advanced'}); $ (button.btn_action »). Нажмите (Ajax_Action_button); $ (. "{__ ('e_email')}", ': number': "{__ ('e_decimal')}", ': url': "{__ ('e_url')}", '[max]': "{__ ('e_max_length')}", '[min]': "{__ ('e_max_length')}", '[ne_max_lgen '[обязательно]': "{__ ('e_not_empty')}",});});Выше всего содержание этой статьи. Я надеюсь, что для всех будет полезно овладеть операциями обработки формы JavaScript. Спасибо за чтение.