/** * 注册命名空间:baidu.regexp */ baidu.namespace.register("baidu.regexp"); /** * 自适应高度的jquery插件 */ $.fn.extend({ textareaAutoHeight:function (options) { this._options = { minHeight:0, maxHeight:100000 }; this.init = function () { for (var p in options) { this._options[p] = options[p]; } if (this._options.minHeight == 0) { this._options.minHeight = parseFloat($(this).height()); } for (var p in this._options) { if ($(this).attr(p) == null) { $(this).attr(p, this._options[p]); } } $(this).keyup(this.resetHeight).change(this.resetHeight) .focus(this.resetHeight); } this.resetHeight = function () { var _minHeight = parseFloat($(this).attr("minHeight")); var _maxHeight = parseFloat($(this).attr("maxHeight")); if (!$.browser.msie) { $(this).height(0); } var h = parseFloat(this.scrollHeight); h = h < _minHeight ? _minHeight : h > _maxHeight ? _maxHeight : h; $(this).height(h).scrollTop(h); if (h >= _maxHeight) { $(this).css("overflow-y", "scroll"); } else { $(this).css("overflow-y", "hidden"); } } this.init(); } }); baidu.regexp = (function () { "use strict"; var regElm, srcElm, rstElm, rstCount, srcBackgroundElm, srcWrapperElm, regListElm; var ID_PREFIX = 'tmp_id_'; var TAG_MATCHED = 'b'; var TAG_NOT_MATCHED = 'i'; var TR_ID_PREFIX = 'tr_' + ID_PREFIX; var _getRegExp = function (regTxt) { try { return new Function('return ' + regTxt)(); } catch (e) { return null; } } var _buildTable = function (rstArray) { var tbl = [""]; tbl.push('') $.each(rstArray, function (i, item) { tbl.push(''); tbl.push('' + '' + ''); tbl.push(''); }); tbl.push('
序号匹配结果在原字符串中的位置
' + (i + 1) + '' + item.text + '' + item.index + '
'); return tbl.join(''); }; var _createTag = function (type, item) { var tags = []; for (var i = 0, len = item.text.length; i < len; i++) { tags.push('<' + type + ' data-id="' + ID_PREFIX + item.index + '">' + item.text.charAt(i) + ''); } return tags.join(''); } var _blinkHighlight = function () { $('tr[id^=' + TR_ID_PREFIX + ']').click(function (e) { var index = $(this).attr('data-index'); var tags = $(TAG_MATCHED + '[data-id=' + ID_PREFIX + index + ']'); tags.animate({ opacity:0 }, 200).delay().animate({ opacity:1 }, 200).delay().animate({ opacity:0 }, 200).delay().animate({ opacity:1 }, 200); }); }; var _highlight = function (srcText, rstArray) { if (!srcText) { srcBackgroundElm.html(''); return; } var hl = []; var preIndex = 0; $.each(rstArray, function (i, item) { if (i == 0) { if (item.index == 0) { hl.push(_createTag(TAG_MATCHED, item)); } else { hl.push(_createTag(TAG_NOT_MATCHED, { index:0, text:srcText.substring(0, item.index) })); hl.push(_createTag(TAG_MATCHED, item)); } } else { preIndex = rstArray[i - 1].index + rstArray[i - 1].text.length; hl.push(_createTag(TAG_NOT_MATCHED, { index:preIndex, text:srcText.substring(preIndex, item.index) })); hl.push(_createTag(TAG_MATCHED, item)); } }); srcBackgroundElm.html(hl.join('')); _blinkHighlight(); }; var _emptyTable = function (message) { var tbl = [""]; tbl.push(''); tbl.push(''); tbl.push('
序号匹配结果
' + message + '
') return tbl.join(''); }; var _dealRegMatch = function (e) { srcWrapperElm.height(srcElm.height() + 24); var regTxt = regElm.val().trim(); var srcTxt = srcElm.val().trim(); if (!regTxt || !srcTxt) { rstElm.html(_emptyTable('不能匹配')); rstCount.html('0个'); _highlight(); } else { var reg = _getRegExp(regTxt); if (!reg || !reg instanceof RegExp) { rstElm.html(_emptyTable('正则表达式错误!')); rstCount.html('0个'); _highlight(); return; } var rst = []; // 用字符串的replace方法来找到匹配目标在元字符串中的准确位置 srcTxt.replace(reg, function () { var matchedTxt = arguments[0]; var txtIndex = arguments[arguments.length - 2]; rst.push({ text:matchedTxt, index:txtIndex }); }); if (!rst || !rst.length) { rstElm.html(_emptyTable('不能匹配')); rstCount.html('0个'); _highlight(); } else { rstElm.html(_buildTable(rst)); rstCount.html(rst.length + '个'); _highlight(srcElm.val(), rst); } } }; var _init = function () { $(function () { regElm = $('#regText'); srcElm = $('#srcCode'); srcBackgroundElm = $('#srcBackground'); srcWrapperElm = $('#srcWrapper'); rstElm = $('#rstCode').html(_emptyTable('暂无输入')); rstCount = $('#rstCount'); regListElm = $('#regList'); // 输入框自适应高度 regElm.textareaAutoHeight({minHeight:34}); srcElm.textareaAutoHeight({minHeight:50}); srcBackgroundElm.textareaAutoHeight({minHeight:50}); // 监听两个输入框的按键、paste、change事件 $('#regText,#srcCode').keyup(_dealRegMatch).change(_dealRegMatch) .bind('paste', _dealRegMatch); regListElm.change(function (e) { var reg = $(this).val(); var regTipElm = $('#regTip'); regElm.val(reg); if (!reg) { regTipElm.hide(); } else { regTipElm.show(); } }); }); }; return { init:_init }; })(); baidu.regexp.init();