JS关键字变色实现思路及代码

　　public static string ReplaceRed(string strtitle, string redkey)

　　{

　　if (redkey == "" || redkey == null)

　　{

　　return strtitle;

　　}

　　else

　　strtitle = strtitle.Replace(redkey, " <font color='#ff0000'>" + redkey + " </font>");

　　return strtitle;

　　}

　　protected string HighlightText(string inputText,string searchWord)

　　{

　　System.Text.RegularExpressions.Regex expression = new System.Text.RegularExpressions.Regex(searchWord.Replace(" ", "|"), System.Text.RegularExpressions.RegexOptions.IgnoreCase);

　　return expression.Replace(inputText,new System.Text.RegularExpressions.MatchEvaluator(ReplaceKeywords));

　　}

　　public string ReplaceKeywords(System.Text.RegularExpressions.Match m)

　　{

　　return "<span class='highlightTxtSearch'>" + m.Value + "</span>";//关键字背景加色

　　//return "<font color='#ff0000'>" + m.Value + "</font>";//关键字变色

　　}

　　<style type="text/css">

　　.highlightTxtSearch

　　{

　　background-color:Yellow;

　　}

　　</style>

　　<script type="text/javascript">

　　$(function () {

　　$('#tt').datagrid({

　　url: '@Url.Content("~/Domain/LoadDomainAdmin")',

　　width: "90%",

　　height: 400,

　　fitColumns: true,

　　nowrap: false,

　　idField: 'UserID',

　　pagination: true,

　　pageNumber: 1,

　　singleSelect: true,

　　frozenColumns: [[{ field: 'radio', formatter: function (value, row, index) {

　　return '<input type="radio" name="rd_action" />';

　　}

　　}]],

　　columns: [[

　　{ field: 'UserID', title: 'UserID', width: 260, hidden: 'true' },

　　{ field: 'LoginName', title: '@ViewBag.LoginName', width: 180, align: 'left', formatter: function (data) {

　　//return "<div class='hiddenFontGommom' style='text-align:left;'>" + data + "</div>";

　　return GetNewData(data);

　　}

　　},

　　{ field: 'FirstName', title: '@ViewBag.FirstName', width: 120, align: 'left', formatter: function (data) {

　　//return "<div style='text-align:left;' title=" + data + ">" + data + "</div>";

　　return GetNewData(data);

　　// var keyword = $.trim($("#txtInfo").val()) == '@ViewBag.SearchText' ? "" : $.trim($("#txtInfo").val());

　　// if (keyword == "") {

　　// return "<div style='text-align:left;' title=" + data + ">" + data + "</div>";

　　// }

　　// else {

　　// var returnData = "";

　　// $.ajax({

　　// type: "POST",

　　// url: '@Url.Content("~/Domain/HighlightText")' + "?inputText=" + data + "&searchWord=" + keyword,

　　// async: false,

　　// success: function (newdata) {

　　// //重新赋值

　　// returnData = newdata;

　　// },

　　// error: function () {

　　// //不修改returnData值

　　// }

　　// });

　　// return "<div style='text-align:left;' title=" + data + ">" + returnData + "</div>";

　　// }

　　}

　　},

　　{ field: 'LastName', title: '@ViewBag.LastName', width: 120, align: 'left', formatter: function (data) {

　　//return "<div style='text-align:left;' title=" + data + ">" + data + "</div>";

　　return GetNewData(data);

　　}

　　},

　　{ field: 'Email', title: '@ViewBag.Email', width: 180, align: 'left', formatter: function (data) {

　　return "<div class='hiddenFontGommom' style='text-align:left;' title=" + data + ">" + data + "</div>";

　　}

　　},

　　// { field: 'Domian', title: '@ViewBag.Domian', width: 180, align: 'left', formatter: function (data) {

　　// return "<div style='text-align:left;' title=" + data + ">" + data + "</div>";

　　// }

　　// },

　　// { field: 'Role', title: '@ViewBag.Role', width: 180, align: 'left', formatter: function (data) {

　　// return "<div style='text-align:left;' class='hiddenFontGommom' title=" + data.replace(" ", "").replace(" ", "") + ">" + data + "</div>";

　　// }

　　// },

　　// {field: 'IsEnabled', title: '@ViewBag.State', align: 'center', width: 150, formatter: function (val) {

　　// if (val == true)

　　// return "<div class='devicetypes_a_box'>True</div>";

　　// else

　　// return "<div class='devicetypes_a_box'>False</div>";

　　// }

　　// }

　　]],

　　onBeforeLoad: function (row, param) {

　　//移除头部批量勾选框

　　$(".datagrid-header-check input").css("visibility", "hidden");

　　//隐藏分页

　　//$(".datagrid-pager").css("display", "none");

　　//$(".datagrid-pager").removeClass("datagrid-pager");

　　return true;

　　},

　　onLoadSuccess: function (data) {

　　if (data.rows.length == 0) {

　　$(".datagrid-view2 .datagrid-body").html("<div style='text-align:center; margin-top:0px; height:50px;'>" + userManage_index_SearchMsg + "</div>");

　　}

　　else {

　　$('#tt').datagrid('selectRecord', '@ViewBag.AdminId');

　　$("input[name=rd_action]", $("div.datagrid-view1 tr.datagrid-row-selected")).attr("checked", "checked");

　　}

　　$("div.datagrid-header-check input").removeAttr("checked"); //重新加载时去掉复选框的选中

　　//$('#tt').datagrid('unselectAll');

　　var queryParams = $('#tt').datagrid('options').queryParams;

　　queryParams.IsSerach = "NO";

　　queryParams.DomainId = $("#xDomainId").val();

　　$('#tt').datagrid('options').queryParams = queryParams;

　　},

　　// onSelect: function () {

　　// ChSelect();

　　// },

　　// onUnselect: function () {

　　// ChSelect();

　　// },

　　onClickRow: function (row) {

　　$("input[name=rd_action]", $("div.datagrid-view1 tr.datagrid-row-selected")).attr("checked", "checked");

　　}

　　});

　　var p = $('#tt').datagrid('getPager');

　　$(p).pagination({

　　pageNumber: 1,

　　pageSize: 10, //每页显示的记录条数，默认为10

　　pageList: [5, 10, 15], //可以设置每页记录条数的列表

　　displayMsg: "" //'当前显示 {from} - {to} 条记录 共 {total} 条记录',

　　});

　　$("#btn_search").click(function () {

　　$("#importErrorMsg").find("div").css("display", "none");

　　var queryParams = $('#tt').datagrid('options').queryParams;

　　queryParams.FullName = $.trim($("#txtInfo").val()) == '@ViewBag.SearchText' ? "" : $.trim($("#txtInfo").val());

　　queryParams.IsSerach = "YES";

　　$('#tt').datagrid('options').queryParams = queryParams;

　　$("#tt").datagrid('reload');

　　var p = $('#tt').datagrid('getPager');

　　$(p).pagination({

　　pageNumber: 1,

　　pageList: [5, 10, 15], //可以设置每页记录条数的列表

　　displayMsg: "" //'当前显示 {from} - {to} 条记录 共 {total} 条记录',

　　});

　　})

　　$(".pagination-num").keydown(function (event) {

　　var event = event || window.event;

　　if (event.keyCode == 13)

　　event.keyCode = 9;

　　if ((event.keyCode < 48 || event.keyCode > 57) && event.keyCode != 8 && event.keyCode != 46 && (event.keyCode < 96 || event.keyCode > 105)) {

　　event.preventDefault();

　　event.returnValue = false;

　　}

　　});

　　$(".datagrid-cell").css("textAlign", "center"); //表头内容居中

　　});

　　function ChSelect() {

　　// var row = $('#tt').datagrid('getChecked');

　　// var rows = $('#tt').datagrid('getRows');

　　// row.length == rows.length ? $("div.datagrid-header-check input").attr("checked", true) : $("div.datagrid-header-check input").removeAttr("checked");

　　}

　　function GetNewData(data) {

　　var keyword = $.trim($("#txtInfo").val()) == '@ViewBag.SearchText' ? "" : $.trim($("#txtInfo").val());

　　if (keyword == "") {

　　return "<div style='text-align:left;' title=" + data + ">" + data + "</div>";

　　}

　　else {

　　var returnData = "";

　　$.ajax({

　　type: "POST",

　　url: '@Url.Content("~/Domain/HighlightText")' + "?inputText=" + data + "&searchWord=" + keyword,

　　async: false,

　　success: function (newdata) {

　　//重新赋值

　　returnData = newdata;

　　},

　　error: function () {

　　//不修改returnData值

　　}

　　});

　　return "<div style='text-align:left;' title=" + data + ">" + returnData + "</div>";

　　//title中的data要和后面的data分开，不要后台返回的会让title中的data也跟着改变

　　}

　　}

　　</script>