json筛选：var materialBymaterCode = materialJson.filter(function(e){return e.MaterialCode == "134";});//或者function(e){return e.MaterialCode > 0;}

//Ajax用法：============================================================================================================================================================================== $(selector).load(URL,data,callback);//URL 是加载的url，data是获取的数据，callback为方法 function(){} 暂无具体例子 $("#div1").load("demo_test.txt");//加载指定文档 $("#div1").load("demo_test.txt #p1"); //加载指定文档中id为p1的部分 $("button").click(function(){ $.get("/home/getVal",function(data,status){ alert("Data: " + data + "\nStatus: " + status); }); });//向对应url获取信息，home是控制器，getVal是方法，（控制器中可以使用return Json(json);）data是拿到的数据；status：如果成功就是success $("button").click(function(){ $.post("/home/getVal", { name:"Donald Duck", city:"Duckburg" }, function(data,status){ alert("Data: " + data + "\nStatus: " + status); }); }); //控制器中： public async Task getVal(string name，string city) { //。。。 return Json("{result:NG}"); //或 return Json(json); }

1、页面加载后初始化方法==============================================================================================================================================================================

2、按钮初始化click============================================================================================================================================================================== $("p").unbind("click"); //如有可能多次设置click方法，那这里需要unbind一次，不然会多次触发 $("p").click(function(){ $(this).hide(); });

3、获取控制器传的ViewBag============================================================================================================================================================================== "@ViewBage.abc"或'@ViewBage.abc'

4、获取控制器传的Json数据==================================================================================================================================================================================================== =》控制器处理： using Newtonsoft.Json; 使用ViewBag: json = JsonConvert.SerializeObject(_context.UrlRecords.ToList(), Formatting.Indented); ViewBag.urls = json; 使用post请求（ajax） json = JsonConvert.SerializeObject(_context.UrlRecords.ToList(), Formatting.Indented); return Json(json);

=>视图 @using Newtonsoft.Json; 使用viewBag： var urlList = @Html.Raw(JsonConvert.SerializeObject(ViewBag.urls)); var urlJsonList = eval('(' + urlList + ')'); 遍历： for (var i in urlJsonList) { urlJsonList[i].UserName } 如果需要转字符串： JSON.stringify(urlJsonList)或者在for中JSON.stringify(urlJsonList[i]) 使用Ajax post: $.post("/Home/urlSave", { Id: $(".id").text().trim(), UserId: $(".UserId").text(), UrlName: $(".UrlName").val(), UrlInfo: $(".UrlInfo").val(), UrlClass: $(".UrlClass").val(), UrlString: $(".UrlString").val() }, function (data, status) { urlJsonList = eval('(' + data + ')'); divPageFunction(currentPage); $(".second.modal .description").text(status == "success" ? "操作成功" : "操作失败"); $(".second.modal").modal('show'); $(".second.modal .button").unbind("click"); $(".second.modal .button").click(function () { $(".second.modal").modal('hide'); }); //alert("Data: " + data + "\nStatus: " + status); });

//分页、过滤、查询=================================================================================================================== //过滤部分================ var u = window.u || {}; u.isArray = function (o) { return typeof o == 'object' && Object.prototype.toString.call(o).slice(8, -1).toLowerCase() == 'array'; };
u.search = function (array, value) {
if (!u.isArray(array)) throw new Error('第一个参数必须是数组类型'); var arr = []; arr = array.filter(function (a) { return JSON.stringify(a).indexOf(value) != -1;//遍历JSON的每条数据，如果包含字符串就取出 }); return arr; }; //用法：JsonAfterFilter = u.search(urlJsonList, JsonFilterStr); //===========================

//在这里初始化js中的全局变量 var urlList = @Html.Raw(JsonConvert.SerializeObject(ViewBag.urls));//从viewbag中拿到JSON数据 var urlJsonList = eval('(' + urlList + ')'); //转换一次 var TotalUrlCount = urlJsonList == null ? 0 : urlJsonList.length; //总记录数量 var numPerPage = 15; //每页显示的数量 var TotalUrlPage = parseInt((TotalUrlCount - 1) / numPerPage + 1); //总共的页数 var sortName = ""; //按照那个参数排序 var sortSerial = false; //排序是倒序还是顺序 var JsonAfterFilter; //过滤后的JSON数据 var JsonFilterStr = ""; //过滤关键字 var htmlStr = ""; //用于动态显示的html字符串 var currentPage = 1; //当前页数 var shownum = 5; //标签上显示1 2 3 4 5 的个数 //在这里处理刚加载后的第一页 $(function(){ if ("@ViewBag.page" == "urlConfig") { var currentPage = 1; //首次进入为第一页 divPageFunction(currentPage); //显示分页标签 } }) //分页的标签显示 function divPageFunction(pageNow) { //先过滤需要显示的数据 if (JsonFilterStr != "") //是否有过滤字符串 JsonAfterFilter = u.search(urlJsonList, JsonFilterStr); else JsonAfterFilter = urlJsonList; //因为可能过滤后总数编号，需要重新计算总页数 TotalUrlCount = JsonAfterFilter == null ? 0 : JsonAfterFilter.length; TotalUrlPage = parseInt((TotalUrlCount - 1) / numPerPage + 1); //赋值当前也，以供其他地方使用 currentPage = pageNow;

        //part1:分页标签显示，加首页显示
            htmlStr = "<div class='ui mini pagination menu'>";
            htmlStr += "<a class='item' href='#' onclick='divPageFunction(1)'> 首页</a>";
        //获取标签上需要显示的page num 如1，2，3，4，5；
            var vIndexs = getShowPageIndexs(pageNow, TotalUrlPage, shownum);
        //显示的第一个是2时，就加一个1
            if (vIndexs[0]==2)
                htmlStr += "<a class='item' href='#' onclick='divPageFunction(1)'>1</a>"
        //显示的第一个比2大时，就加一个1和一个...
            if (vIndexs[0] > 2) {
                 htmlStr += "<a class='item' href='#' onclick='divPageFunction(1)'>1</a>"
                 htmlStr += "<a class='disabled item' href='#'>...</a>";
               }
         //显示中间的page num
             for (var i = 0; i < vIndexs.length; i++) {
                 if (vIndexs[i] == pageNow)
                    htmlStr += "<a class='active item' href='#' onclick='divPageFunction(" + vIndexs[i] + ")'>" + vIndexs[i] + "</a>"
                 else
                    htmlStr += "<a class='item' href='#' onclick='divPageFunction(" + vIndexs[i] + ")'>" + vIndexs[i] + "</a>"
                }
         //显示的最后一个是倒数第二个以上的，就在后面加一个...和一个max
             if (TotalUrlPage > vIndexs[vIndexs.length - 1] + 1) {
                 htmlStr += "<a class='disabled item' href='#'>...</a>";
                 htmlStr += "<a class='item' href='#' onclick='divPageFunction(" + TotalUrlPage+ ")'>"+TotalUrlPage+"</a>";
                }
          //显示的最后一个是倒数第二个时，就在后面加一个max
             else if (TotalUrlPage == vIndexs[vIndexs.length - 1] + 1) {
                 htmlStr += "<a class='item' href='#' onclick='divPageFunction(" + TotalUrlPage+ ")'>"+TotalUrlPage+"</a>";
                }
          //显示末页
                htmlStr += "<a class='item' href='#' onclick='divPageFunction(" + TotalUrlPage+ ")'>末页</a>";
                htmlStr += "</div>";
           //显示出来
          $("#divPages").html(htmlStr);

           //根据当前页显示table信息
                divTableFunction(pageNow);
            }

        //根据数据量获取标签上需要显示的页数。思路是循环判断当前页数-1、+1、-2、+2、-3、+3...，存储满足要求的序号到数组，直到数量超过需要显示的2倍或者达到显示的数量就返回
        function getShowPageIndexs(pageNow,totalPage,showNum) {
            var ListIndexs = [];
            var count = 1;
            var step = 1;
            ListIndexs.push(pageNow);
            while (count < showNum && step < showNum * 2) {
                if (pageNow - step > 0 && count < showNum) { ListIndexs.splice(0, 0, pageNow - step); count++; }
                if (pageNow + step <= totalPage && count < showNum) { ListIndexs.splice(ListIndexs.length, 0, pageNow + step); count++; }
                step++;
            }
            return ListIndexs;
        }
        //页面的数据处理
        function divTableFunction(pageNow) {
            htmlStr = "";                //清空显示字符串
            var index = 1;                //标记当前的序号
            JsonAfterFilter.sort(sortBy(sortName == "" ? "UrlName" : sortName, sortSerial, String));    //对过滤后的数据进行排序
        //遍历并显示过滤后的数据JsonAfterFilter
            for (var i in JsonAfterFilter) {
                if (index > (pageNow - 1) * numPerPage && index <= pageNow * numPerPage) {        //序号index在当前页内
                    var jsonStr1 = JSON.stringify(JsonAfterFilter[i]).replace(/\"/g, "&quot;");        //将双引号改成&quot; 并传给JSONStr1，以便html中点击时，把这个json传给弹出框使用
                    htmlStr += "<tr>";
                    @* <td>@users.First(user => user.Id == u.UserId).UserName</td> *@
                    htmlStr += "       <td>" + JsonAfterFilter[i].UserName + "</td>";
                    htmlStr += "       <td>" + JsonAfterFilter[i].UrlName + "</td>";
                    htmlStr += "       <td>" + JsonAfterFilter[i].UrlInfo + "</td>";
                    htmlStr += "       <td>" + JsonAfterFilter[i].UrlClass + "</td>";
                    htmlStr += "       <td>" + JsonAfterFilter[i].UrlString + "</td>";
                    htmlStr += "       <td>";
                    htmlStr += "           <div class='ui mini buttons'>";
                    htmlStr += "               <button class='ui green button' onclick=\"showModal(\'" + jsonStr1 + "\')\">查看</button>";            //调用showModal的方法，把json（字符串）传过去,以便弹框与显示信息
                    htmlStr += "               <div class='or'></div>";
                    htmlStr += "               <button class='ui red button' onclick=\"showDoubleButtonModal(\'deleteUrl\',\'" + jsonStr1 + "\')\">删除</button>";//{'name':'frank', 'age':29, 'birthday':'1978 - 1 - 1'}
                    htmlStr += "           </div>";
                    htmlStr += "       </td>";
                    htmlStr += "   </tr>";
                }
                index++;
                }
        $(".tableShow").html(htmlStr);
    }

//显示模态框 查看的处理==================================== function showModal(obj) { var url = JSON.parse(obj); //将字符串转成Json $(".first.modal .header").text(url.UrlName); //修改第一个框标题 $(".first.modal .description").html( //修改第一个框的描述 "

//modal的定义

    <!--提示模态框-->
    <div class="ui second small coupled modal">
        <div class="header">
            提示
        </div>
        <div class="image content">
            <div class="description">
                描述可以出现在右边
            </div>
        </div>
        <div class="actions">
            <div class="ui button">OK</div>
        </div>
    </div>

    <!--双按钮模态框-->
    <div class="ui small modal doubleButtonModal">
        <div class="header">
            提示
        </div>
        <div class="image content">
            <div class="description">
                描述可以出现在右边
            </div>
        </div>
        <div class="actions">
            <div class="ui button" id="cancelButton">取消</div>
            <div class="ui button" id="sureButton">确定</div>
        </div>
    </div>
</div>