jQuery-easyUI拓展textbox
来源：互联网 发布：c语言三角函数的使用 编辑：程序博客网 时间：2024/05/10 20:26
easyUI在实际使用中遇到这样的问题，textbox不能输入特殊字符，如：, “” : {} []等…所有需要拓展
查看源码:
(function($) { var _4e0 = 0; function init(_4e1) { $(_4e1).addClass("textbox-f").hide(); var span = $("<span class=\"textbox\">" + "<input class=\"textbox-text\" autocomplete=\"off\">" + "<input type=\"hidden\" class=\"textbox-value\">" + "</span>") .insertAfter(_4e1); var name = $(_4e1).attr("name"); if (name) { span.find("input.textbox-value").attr("name", name); $(_4e1).removeAttr("name").attr("textboxName", name); } return span; }; function _4e2(_4e3) { var _4e4 = $.data(_4e3, "textbox"); var opts = _4e4.options; var tb = _4e4.textbox; var _4e5 = "_easyui_textbox_input" + (++_4e0); tb.find(".textbox-text").remove(); if (opts.multiline) { $("<textarea id=\"" + _4e5 + "\" class=\"textbox-text\" autocomplete=\"off\"></textarea>") .prependTo(tb); } else { $("<input id=\"" + _4e5 + "\" type=\"" + opts.type + "\" class=\"textbox-text\" autocomplete=\"off\">") .prependTo(tb); } $("#" + _4e5).attr("tabindex", $(_4e3).attr("tabindex") || "").css( "text-align", $(_4e3).css("text-align")); tb.find(".textbox-addon").remove(); var bb = opts.icons ? $.extend(true, [], opts.icons) : []; if (opts.iconCls) { bb.push({ iconCls : opts.iconCls, disabled : true }); } if (bb.length) { var bc = $("<span class=\"textbox-addon\"></span>").prependTo(tb); bc.addClass("textbox-addon-" + opts.iconAlign); for (var i = 0; i < bb.length; i++) { bc .append("<a href=\"javascript:void(0)\" class=\"textbox-icon " + bb[i].iconCls + "\" icon-index=\"" + i + "\" tabindex=\"-1\"></a>"); } } tb.find(".textbox-button").remove(); if (opts.buttonText || opts.buttonIcon) { var btn = $("<a href=\"javascript:void(0)\" class=\"textbox-button\"></a>") .prependTo(tb); btn.addClass("textbox-button-" + opts.buttonAlign).linkbutton({ text : opts.buttonText, iconCls : opts.buttonIcon, onClick : function() { var t = $(this).parent().prev(); t.textbox("options").onClickButton.call(t[0]); } }); } if (opts.label) { if (typeof opts.label == "object") { _4e4.label = $(opts.label); _4e4.label.attr("for", _4e5); } else { $(_4e4.label).remove(); _4e4.label = $("<label class=\"textbox-label\"></label>") .html(opts.label); _4e4.label.css("textAlign", opts.labelAlign).attr("for", _4e5); if (opts.labelPosition == "after") { _4e4.label.insertAfter(tb); } else { _4e4.label.insertBefore(_4e3); } _4e4.label .removeClass("textbox-label-left textbox-label-right textbox-label-top"); _4e4.label.addClass("textbox-label-" + opts.labelPosition); } } else { $(_4e4.label).remove(); } _4e6(_4e3); _4e7(_4e3, opts.disabled); _4e8(_4e3, opts.readonly); }; function _4e9(_4ea) { var tb = $.data(_4ea, "textbox").textbox; tb.find(".textbox-text").validatebox("destroy"); tb.remove(); $(_4ea).remove(); }; function _4eb(_4ec, _4ed) { var _4ee = $.data(_4ec, "textbox"); var opts = _4ee.options; var tb = _4ee.textbox; var _4ef = tb.parent(); if (_4ed) { if (typeof _4ed == "object") { $.extend(opts, _4ed); } else { opts.width = _4ed; } } if (isNaN(parseInt(opts.width))) { var c = $(_4ec).clone(); c.css("visibility", "hidden"); c.insertAfter(_4ec); opts.width = c.outerWidth(); c.remove(); } var _4f0 = tb.is(":visible"); if (!_4f0) { tb.appendTo("body"); } var _4f1 = tb.find(".textbox-text"); var btn = tb.find(".textbox-button"); var _4f2 = tb.find(".textbox-addon"); var _4f3 = _4f2.find(".textbox-icon"); if (opts.height == "auto") { _4f1.css({ margin : "", paddingTop : "", paddingBottom : "", height : "", lineHeight : "" }); } tb._size(opts, _4ef); if (opts.label && opts.labelPosition) { if (opts.labelPosition == "top") { _4ee.label._size({ width : opts.labelWidth == "auto" ? tb.outerWidth() : opts.labelWidth }, tb); if (opts.height != "auto") { tb._size("height", tb.outerHeight() - _4ee.label.outerHeight()); } } else { _4ee.label._size({ width : opts.labelWidth, height : tb.outerHeight() }, tb); if (!opts.multiline) { _4ee.label.css("lineHeight", _4ee.label.height() + "px"); } tb._size("width", tb.outerWidth() - _4ee.label.outerWidth()); } } if (opts.buttonAlign == "left" || opts.buttonAlign == "right") { btn.linkbutton("resize", { height : tb.height() }); } else { btn.linkbutton("resize", { width : "100%" }); } var _4f4 = tb.width() - _4f3.length * opts.iconWidth - _4f5("left") - _4f5("right"); var _4f6 = opts.height == "auto" ? _4f1.outerHeight() : (tb.height() - _4f5("top") - _4f5("bottom")); _4f2.css(opts.iconAlign, _4f5(opts.iconAlign) + "px"); _4f2.css("top", _4f5("top") + "px"); _4f3.css({ width : opts.iconWidth + "px", height : _4f6 + "px" }); _4f1.css({ paddingLeft : (_4ec.style.paddingLeft || ""), paddingRight : (_4ec.style.paddingRight || ""), marginLeft : _4f7("left"), marginRight : _4f7("right"), marginTop : _4f5("top"), marginBottom : _4f5("bottom") }); if (opts.multiline) { _4f1.css({ paddingTop : (_4ec.style.paddingTop || ""), paddingBottom : (_4ec.style.paddingBottom || "") }); _4f1._outerHeight(_4f6); } else { _4f1.css({ paddingTop : 0, paddingBottom : 0, height : _4f6 + "px", lineHeight : _4f6 + "px" }); } _4f1._outerWidth(_4f4); if (!_4f0) { tb.insertAfter(_4ec); } opts.onResize.call(_4ec, opts.width, opts.height); function _4f7(_4f8) { return (opts.iconAlign == _4f8 ? _4f2._outerWidth() : 0) + _4f5(_4f8); }; function _4f5(_4f9) { var w = 0; btn.filter(".textbox-button-" + _4f9).each(function() { if (_4f9 == "left" || _4f9 == "right") { w += $(this).outerWidth(); } else { w += $(this).outerHeight(); } }); return w; }; }; function _4e6(_4fa) { var opts = $(_4fa).textbox("options"); var _4fb = $(_4fa).textbox("textbox"); _4fb.validatebox($.extend({}, opts, { deltaX : function(_4fc) { return $(_4fa).textbox("getTipX", _4fc); }, onBeforeValidate : function() { opts.onBeforeValidate.call(_4fa); var box = $(this); if (!box.is(":focus")) { if (box.val() !== opts.value) { opts.oldInputValue = box.val(); box.val(opts.value); } } }, onValidate : function(_4fd) { var box = $(this); if (opts.oldInputValue != undefined) { box.val(opts.oldInputValue); opts.oldInputValue = undefined; } var tb = box.parent(); if (_4fd) { tb.removeClass("textbox-invalid"); } else { tb.addClass("textbox-invalid"); } opts.onValidate.call(_4fa, _4fd); } })); }; function _4fe(_4ff) { var _500 = $.data(_4ff, "textbox"); var opts = _500.options; var tb = _500.textbox; var _501 = tb.find(".textbox-text"); _501.attr("placeholder", opts.prompt); _501.unbind(".textbox"); $(_500.label).unbind(".textbox"); if (!opts.disabled && !opts.readonly) { if (_500.label) { $(_500.label).bind("click.textbox", function(e) { if (!opts.hasFocusMe) { _501.focus(); $(_4ff).textbox("setSelectionRange", { start : 0, end : _501.val().length }); } }); } _501.bind("blur.textbox", function(e) { if (!tb.hasClass("textbox-focused")) { return; } opts.value = $(this).val(); if (opts.value == "") { $(this).val(opts.prompt).addClass("textbox-prompt"); } else { $(this).removeClass("textbox-prompt"); } tb.removeClass("textbox-focused"); }).bind("focus.textbox", function(e) { opts.hasFocusMe = true; if (tb.hasClass("textbox-focused")) { return; } if ($(this).val() != opts.value) { $(this).val(opts.value); } $(this).removeClass("textbox-prompt"); tb.addClass("textbox-focused"); }); for (var _502 in opts.inputEvents) { _501.bind(_502 + ".textbox", { target : _4ff }, opts.inputEvents[_502]); } } var _503 = tb.find(".textbox-addon"); _503.unbind().bind("click", { target : _4ff }, function(e) { var icon = $(e.target) .closest("a.textbox-icon:not(.textbox-icon-disabled)"); if (icon.length) { var _504 = parseInt(icon.attr("icon-index")); var conf = opts.icons[_504]; if (conf && conf.handler) { conf.handler.call(icon[0], e); } opts.onClickIcon.call(_4ff, _504); } }); _503.find(".textbox-icon").each(function(_505) { var conf = opts.icons[_505]; var icon = $(this); if (!conf || conf.disabled || opts.disabled || opts.readonly) { icon.addClass("textbox-icon-disabled"); } else { icon.removeClass("textbox-icon-disabled"); } }); var btn = tb.find(".textbox-button"); btn.linkbutton((opts.disabled || opts.readonly) ? "disable" : "enable"); tb.unbind(".textbox").bind("_resize.textbox", function(e, _506) { if ($(this).hasClass("easyui-fluid") || _506) { _4eb(_4ff); } return false; }); }; function _4e7(_507, _508) { var _509 = $.data(_507, "textbox"); var opts = _509.options; var tb = _509.textbox; var _50a = tb.find(".textbox-text"); var ss = $(_507).add(tb.find(".textbox-value")); opts.disabled = _508; if (opts.disabled) { _50a.blur(); _50a.validatebox("disable"); tb.addClass("textbox-disabled"); ss.attr("disabled", "disabled"); $(_509.label).addClass("textbox-label-disabled"); } else { _50a.validatebox("enable"); tb.removeClass("textbox-disabled"); ss.removeAttr("disabled"); $(_509.label).removeClass("textbox-label-disabled"); } }; function _4e8(_50b, mode) { var _50c = $.data(_50b, "textbox"); var opts = _50c.options; var tb = _50c.textbox; var _50d = tb.find(".textbox-text"); opts.readonly = mode == undefined ? true : mode; if (opts.readonly) { _50d.triggerHandler("blur.textbox"); } _50d.validatebox("readonly", opts.readonly); tb.removeClass("textbox-readonly").addClass(opts.readonly ? "textbox-readonly" : ""); }; $.fn.textbox = function(_50e, _50f) { if (typeof _50e == "string") { var _510 = $.fn.textbox.methods[_50e]; if (_510) { return _510(this, _50f); } else { return this.each(function() { var _511 = $(this).textbox("textbox"); _511.validatebox(_50e, _50f); }); } } _50e = _50e || {}; return this.each(function() { var _512 = $.data(this, "textbox"); if (_512) { $.extend(_512.options, _50e); if (_50e.value != undefined) { _512.options.originalValue = _50e.value; } } else { _512 = $.data(this, "textbox", { options : $.extend({}, $.fn.textbox.defaults, $.fn.textbox .parseOptions(this), _50e), textbox : init(this) }); _512.options.originalValue = _512.options.value; } _4e2(this); _4fe(this); if (_512.options.doSize) { _4eb(this); } var _513 = _512.options.value; _512.options.value = ""; $(this).textbox("initValue", _513); }); }; $.fn.textbox.methods = { options : function(jq) { return $.data(jq[0], "textbox").options; }, cloneFrom : function(jq, from) { return jq.each(function() { var t = $(this); if (t.data("textbox")) { return; } if (!$(from).data("textbox")) { $(from).textbox(); } var opts = $.extend(true, {}, $(from) .textbox("options")); var name = t.attr("name") || ""; t.addClass("textbox-f").hide(); t.removeAttr("name").attr("textboxName", name); var span = $(from).next().clone().insertAfter(t); var _514 = "_easyui_textbox_input" + (++_4e0); span.find(".textbox-value").attr("name", name); span.find(".textbox-text").attr("id", _514); var _515 = $($(from).textbox("label")).clone(); if (_515.length) { _515.attr("for", _514); if (opts.labelPosition == "after") { _515.insertAfter(t.next()); } else { _515.insertBefore(t); } } $.data(this, "textbox", { options : opts, textbox : span, label : (_515.length ? _515 : undefined) }); var _516 = $(from).textbox("button"); if (_516.length) { t.textbox("button").linkbutton($.extend(true, {}, _516.linkbutton("options"))); } _4fe(this); _4e6(this); }); }, textbox : function(jq) { return $.data(jq[0], "textbox").textbox.find(".textbox-text"); }, button : function(jq) { return $.data(jq[0], "textbox").textbox.find(".textbox-button"); }, label : function(jq) { return $.data(jq[0], "textbox").label; }, destroy : function(jq) { return jq.each(function() { _4e9(this); }); }, resize : function(jq, _517) { return jq.each(function() { _4eb(this, _517); }); }, disable : function(jq) { return jq.each(function() { _4e7(this, true); _4fe(this); }); }, enable : function(jq) { return jq.each(function() { _4e7(this, false); _4fe(this); }); }, readonly : function(jq, mode) { return jq.each(function() { _4e8(this, mode); _4fe(this); }); }, isValid : function(jq) { return jq.textbox("textbox").validatebox("isValid"); }, clear : function(jq) { return jq.each(function() { $(this).textbox("setValue", ""); }); }, setText : function(jq, _518) { return jq.each(function() { var opts = $(this).textbox("options"); var _519 = $(this).textbox("textbox"); _518 = _518 == undefined ? "" : String(_518); if ($(this).textbox("getText") != _518) { _519.val(_518); } opts.value = _518; if (!_519.is(":focus")) { if (_518) { _519.removeClass("textbox-prompt"); } else { _519.val(opts.prompt) .addClass("textbox-prompt"); } } $(this).textbox("validate"); }); }, initValue : function(jq, _51a) { return jq.each(function() { var _51b = $.data(this, "textbox"); $(this).textbox("setText", _51a); _51b.textbox.find(".textbox-value").val(_51a); $(this).val(_51a); }); }, setValue : function(jq, _51c) { return jq.each(function() { var opts = $.data(this, "textbox").options; var _51d = $(this).textbox("getValue"); $(this).textbox("initValue", _51c); if (_51d != _51c) { opts.onChange.call(this, _51c, _51d); $(this).closest("form").trigger("_change", [this]); } }); }, getText : function(jq) { var _51e = jq.textbox("textbox"); if (_51e.is(":focus")) { return _51e.val(); } else { return jq.textbox("options").value; } }, getValue : function(jq) { return jq.data("textbox").textbox.find(".textbox-value").val(); }, reset : function(jq) { return jq.each(function() { var opts = $(this).textbox("options"); $(this).textbox("setValue", opts.originalValue); }); }, getIcon : function(jq, _51f) { return jq.data("textbox").textbox.find(".textbox-icon:eq(" + _51f + ")"); }, getTipX : function(jq, _520) { var _521 = jq.data("textbox"); var opts = _521.options; var tb = _521.textbox; var _522 = tb.find(".textbox-text"); var _523 = tb.find(".textbox-addon")._outerWidth(); var _524 = tb.find(".textbox-button")._outerWidth(); var _520 = _520 || opts.tipPosition; if (_520 == "right") { return (opts.iconAlign == "right" ? _523 : 0) + (opts.buttonAlign == "right" ? _524 : 0) + 1; } else { if (_520 == "left") { return (opts.iconAlign == "left" ? -_523 : 0) + (opts.buttonAlign == "left" ? -_524 : 0) - 1; } else { return _523 / 2 * (opts.iconAlign == "right" ? 1 : -1) + _524 / 2 * (opts.buttonAlign == "right" ? 1 : -1); } } }, getSelectionStart : function(jq) { return jq.textbox("getSelectionRange").start; }, getSelectionRange : function(jq) { var _525 = jq.textbox("textbox")[0]; var _526 = 0; var end = 0; if (typeof _525.selectionStart == "number") { _526 = _525.selectionStart; end = _525.selectionEnd; } else { if (_525.createTextRange) { var s = document.selection.createRange(); var _527 = _525.createTextRange(); _527.setEndPoint("EndToStart", s); _526 = _527.text.length; end = _526 + s.text.length; } } return { start : _526, end : end }; }, setSelectionRange : function(jq, _528) { return jq.each(function() { var _529 = $(this).textbox("textbox")[0]; var _52a = _528.start; var end = _528.end; if (_529.setSelectionRange) { _529.setSelectionRange(_52a, end); } else { if (_529.createTextRange) { var _52b = _529.createTextRange(); _52b.collapse(); _52b.moveEnd("character", end); _52b.moveStart("character", _52a); _52b.select(); } } }); } }; $.fn.textbox.parseOptions = function(_52c) { var t = $(_52c); return $.extend({}, $.fn.validatebox.parseOptions(_52c), $.parser .parseOptions(_52c, ["prompt", "iconCls", "iconAlign", "buttonText", "buttonIcon", "buttonAlign", "label", "labelPosition", "labelAlign", { multiline : "boolean", iconWidth : "number", labelWidth : "number" }]), { value : (t.val() || undefined), type : (t.attr("type") ? t.attr("type") : undefined) }); }; $.fn.textbox.defaults = $.extend({}, $.fn.validatebox.defaults, { doSize : true, width : "auto", height : "auto", prompt : "", value : "", type : "text", multiline : false, icons : [], iconCls : null, iconAlign : "right", iconWidth : 18, buttonText : "", buttonIcon : null, buttonAlign : "right", label : null, labelWidth : "auto", labelPosition : "before", labelAlign : "left", inputEvents : { blur : function(e) { var t = $(e.data.target); var opts = t.textbox("options"); if (t.textbox("getValue") != opts.value) { t.textbox("setValue", opts.value); } }, keydown : function(e) { if (e.keyCode == 13) { var t = $(e.data.target); t.textbox("setValue", t.textbox("getText")); } } }, onChange : function(_52d, _52e) { }, onResize : function(_52f, _530) { }, onClickButton : function() { }, onClickIcon : function(_531) { } });})(jQuery);中的
$.fn.textbox.defaults = $.extend({}, $.fn.validatebox.defaults, { doSize : true, width : "auto", height : "auto", prompt : "", value : "", type : "text", multiline : false, icons : [], iconCls : null, iconAlign : "right", iconWidth : 18, buttonText : "", buttonIcon : null, buttonAlign : "right", label : null, labelWidth : "auto", labelPosition : "before", labelAlign : "left", inputEvents : { blur : function(e) { var t = $(e.data.target); var opts = t.textbox("options"); if (t.textbox("getValue") != opts.value) { t.textbox("setValue", opts.value); } }, keydown : function(e) { if (e.keyCode == 13) { var t = $(e.data.target); t.textbox("setValue", t.textbox("getText")); } } }, onChange : function(_52d, _52e) { }, onResize : function(_52f, _530) { }, onClickButton : function() { }, onClickIcon : function(_531) { } });然后自己扩展一下
$.extend($.fn.textbox.defaults, { inputEvents : { keyup : function(e, param) { var opts = $(e.data.target).textbox("getText"); opts = opts.replace(/[{}\[\],:"]+/, ""); $(e.data.target).textbox("setValue", opts); } }}); 0 0
- jQuery-easyUI拓展textbox
- jQuery EasyUI 1.4的TextBox组件Bug
- Jquery easyui-textbox的异步验证
- jquery-easyUI的应用与拓展
- easyui-textbox
- jquery easyui textbox添加事件不起作用的解决办法
- 【jQuery easyUI】textbox设置只读不可编辑状态
- easyui easyui-textbox自定义验证
- easyui TextBox 回显 换行
- easyUI textbox 验证扩展
- easyui textbox 赋值
- 关于easyui textbox赋值
- easyui-textbox绑定事件
- easyUI textBox事件
- easyui textbox添加验证
- 【easyui】textbox setValue赋值
- easyui textbox 回显 换行
- easyUI textbox填坑
- iOS APP数据
- HTTP首部（一）
- C++multiset集合
- Android audio加载output设备列表流程图
- MairDB 修改表(三)
- jQuery-easyUI拓展textbox
- 实验
- MySQL优化经验 key_buffer_size,query_cache_size,t
- Ubuntu kafka一点点
- eclipse 配置黑色主题
- vim常用指令
- 玩转Android之MVVM开发模式实战，炫酷的DataBinding！
- Kotlin控制流
- linux localtime
