ASP.NET?MVC實(shí)現(xiàn)城市或車型三級(jí)聯(lián)動(dòng)
三級(jí)或多級(jí)聯(lián)動(dòng)的場(chǎng)景經(jīng)常會(huì)碰到,比如省、市、區(qū),比如品牌、車系、車型,比如類別的多級(jí)聯(lián)動(dòng)......我們首先想到的是用三個(gè)select來(lái)展示,這是最通常的做法。但在另外一些場(chǎng)景中,比如確定搜索條件的時(shí)候,對(duì)于三級(jí)聯(lián)動(dòng)來(lái)說(shuō),可能選擇1個(gè),2個(gè),或3個(gè)條件,我想,以下的方式可能更適合:
以上,可以只選擇品牌,或同時(shí)選擇品牌、車系,或同時(shí)選擇品牌、車系、車型,最后把選擇的內(nèi)容展示到input上,并以逗號(hào)隔開。
可以實(shí)現(xiàn)的功能包括:
- 點(diǎn)擊最上面的input彈出div,此時(shí)只顯示品牌區(qū)域
- 點(diǎn)擊最左邊拼音首字母,導(dǎo)航到對(duì)應(yīng)的品牌上
- 當(dāng)把鼠標(biāo)移動(dòng)到某個(gè)品牌上,品牌為選中狀態(tài),其對(duì)應(yīng)的車系顯示在車系區(qū)域
- 當(dāng)鼠標(biāo)不在任何品牌上,所有品牌都為不選中狀態(tài)
- 當(dāng)把鼠標(biāo)移動(dòng)到某個(gè)車系上,車系為選中狀態(tài),其對(duì)應(yīng)的車型顯示在車型區(qū)域,選中車系的所屬品牌也為選中狀態(tài)
- 當(dāng)鼠標(biāo)不在任何車系上,所有車系、品牌都為不選中狀態(tài)
- 當(dāng)把鼠標(biāo)移動(dòng)到某個(gè)車型上,車型為選中狀態(tài),選中車型的所屬車系為選中狀態(tài),選中車系所屬品牌為選中狀態(tài)
- 當(dāng)鼠標(biāo)不在任何車型上,所有車型、車系、品牌為不選中狀態(tài)
- 點(diǎn)擊品牌,品牌顯示到input上
- 點(diǎn)擊車系,品牌、車系顯示到input上,并以逗號(hào)隔開
- 點(diǎn)擊車型,品牌、車系、車型顯示到input上,并以逗號(hào)隔開
- 點(diǎn)擊div上的關(guān)閉按鈕或者頁(yè)面空白區(qū)域,div隱藏
界面的構(gòu)成如下:
- 最上面的是一個(gè)input
- 品牌、車系、車型被包裹在一個(gè)div中,點(diǎn)擊關(guān)閉按鈕或點(diǎn)擊空白處關(guān)閉的就是這個(gè)div
- 品牌區(qū)域是一個(gè)div,分為首字母導(dǎo)航div和品牌顯示div
- 車系區(qū)域是一個(gè)div
- 車型區(qū)域是一個(gè)div
- 品牌、車系、車型內(nèi)的內(nèi)容是一些dl, dt, dd的html元素
- 樣式的事情交給css
實(shí)現(xiàn)的思路大致這樣:
- 給input點(diǎn)擊事件,點(diǎn)擊彈出品牌、車系、車型顯示的div,并綁定頁(yè)面空白區(qū)域的點(diǎn)擊事件
- 導(dǎo)航首字母指向錨點(diǎn),品牌按首字母分類并提供錨點(diǎn)id
- 在控制器中把品牌按照首字母分類,以json格式返回到前端,填充到tmpl模版,再追加到頁(yè)面品牌區(qū)域
- 給品牌添加鼠標(biāo)移上事件,品牌為選中狀態(tài),對(duì)應(yīng)的車系顯示在車系區(qū)域
- 給品牌添加鼠標(biāo)移去事件
- 給品牌添加點(diǎn)擊事件,把點(diǎn)擊品牌顯示到input上
- 給車系添加鼠標(biāo)移上事件,當(dāng)前車系為選中狀態(tài),其對(duì)應(yīng)的車型顯示在車型區(qū)域,其所屬的品牌為選中狀態(tài)
- 給車系添加鼠標(biāo)移去事件
- 給車系添加點(diǎn)擊事件,把點(diǎn)擊車系和所屬品牌顯示到input上,以逗號(hào)隔開
- 給車型添加鼠標(biāo)移上事件,當(dāng)前車型為選擇狀態(tài),其所屬父類車系為選中狀態(tài),車型所屬父類品牌也為選中狀態(tài)
- 給車型添加點(diǎn)擊事件,把點(diǎn)擊車型和所屬車系、品牌顯示到input上,以逗號(hào)隔開
- 給關(guān)閉按鈕添加點(diǎn)擊事件,關(guān)閉div,并解除頁(yè)面空白區(qū)域點(diǎn)擊事件的綁定
領(lǐng)域先行,首先是有關(guān)品牌、車系、車型的模型:
public class CarCategory { public int Id { get; set; } public string Name { get; set; } public int PId { get; set; } public string FirstLetter { get; set; } public string AnchorName { get; set; } public int Level { get; set; } }
- PId屬性用來(lái)表示父類Id,車系的父類Id為某個(gè)品牌Id,車型的父類Id為某個(gè)車系Id
- FirstLetter屬性用來(lái)表示首字母,作為分組的條件
- AnchorName屬性用來(lái)表示品牌的錨點(diǎn)id,車系和車型此項(xiàng)為空
在ASP.NET MVC4中,在Shared/Layout.cshtml中,該有的css,js都必須有:
<head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width" /> <title>@ViewBag.Title</title> @Styles.Render("~/Content/css") @RenderSection("styles", required: false) <link href="~/bootstrap/css/bootstrap.min.css" rel="stylesheet" /> @Scripts.Render("~/bundles/jquery") <script src="~/bootstrap/js/bootstrap.min.js"></script> </head> <body> @RenderBody() @RenderSection("scripts", required: false) </body>
模擬一個(gè)數(shù)據(jù)庫(kù),該數(shù)據(jù)庫(kù)類可以獲取到所有的品牌、車系、車型,以及根據(jù)品牌Id或車系Id獲取對(duì)應(yīng)的車系和車型。
public class Database { public static IEnumerable<CarCategory> GetCarCategories() { return new List<CarCategory>() { new CarCategory(){Id = 0, Name = "奧迪",FirstLetter = "A",AnchorName = "aa", Level = 1, PId = -1}, new CarCategory(){Id = 1, Name = "奧斯頓·馬丁",FirstLetter = "A",AnchorName = "aa", Level = 1, PId = -1}, new CarCategory(){Id = 2, Name = "寶駿",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 3, Name = "巴博斯",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 4, Name = "北汽威旺",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 5, Name = "北汽制造",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 6, Name = "奔馳",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 7, Name = "別克",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 8, Name = "賓利",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 9, Name = "保時(shí)捷",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 10, Name = "比亞迪",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 11, Name = "奔騰",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 12, Name = "標(biāo)致",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 13, Name = "本田",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 14, Name = "寶馬",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 15, Name = "北京汽車",FirstLetter = "B",AnchorName = "bb", Level = 1, PId = -1}, new CarCategory(){Id = 16, Name = "昌河",FirstLetter = "C",AnchorName = "cc", Level = 1, PId = -1}, new CarCategory(){Id = 17, Name = "長(zhǎng)安",FirstLetter = "C",AnchorName = "cc", Level = 1, PId = -1}, new CarCategory(){Id = 18, Name = "長(zhǎng)城",FirstLetter = "C",AnchorName = "cc", Level = 1, PId = -1}, new CarCategory(){Id = 19, Name = "奧迪A4",FirstLetter = "A",AnchorName = "", Level = 2, PId = 0}, new CarCategory(){Id = 20, Name = "奧迪A6L",FirstLetter = "A",AnchorName = "", Level = 2, PId = 0}, new CarCategory(){Id = 21, Name = "奧迪Q3",FirstLetter = "A",AnchorName = "", Level = 2, PId = 0}, new CarCategory(){Id = 22, Name = "奧迪A4舒適版",FirstLetter = "A",AnchorName = "", Level = 3, PId = 19}, new CarCategory(){Id = 23, Name = "奧迪A4尊貴版",FirstLetter = "A",AnchorName = "", Level = 3, PId = 19}, new CarCategory(){Id = 24, Name = "奧迪A6L舒適版",FirstLetter = "A",AnchorName = "", Level = 3, PId = 20}, new CarCategory(){Id = 25, Name = "奧迪A6L黃金版",FirstLetter = "A",AnchorName = "", Level = 3, PId = 20}, new CarCategory(){Id = 26, Name = "奧迪Q3舒適版",FirstLetter = "A",AnchorName = "", Level = 3, PId = 21}, new CarCategory(){Id = 27, Name = "奧迪Q3至尊版",FirstLetter = "A",AnchorName = "", Level = 3, PId = 21}, }; } //根據(jù)品牌或車系I獲取所有車系或車型 public static IEnumerable<CarCategory> GetCarCategoriesByPId(int pid) { return GetCarCategories().Where(c => c.PId == pid); } }
在HomeController中,在前端頁(yè)面加載的時(shí)候,這里提供一個(gè)分組好的所有品牌的json格式給前端;當(dāng)前端把鼠標(biāo)移動(dòng)到某個(gè)品牌上,這里根據(jù)品牌Id返回車系的json格式給前端;當(dāng)前端把鼠標(biāo)移動(dòng)到某個(gè)車系上,這里根據(jù)車系Id返回車型的json格式給前端。
public class HomeController : Controller { public ActionResult Index() { return View(); } //獲取所有品牌 public ActionResult GetPinPai() { var allPinPai = Database.GetCarCategories().Where(c => c.Level == 1).OrderBy(c => c.Id); var result = from p in allPinPai group p by new { p.FirstLetter, p.AnchorName } into g select new {firstletter = g.Key.FirstLetter, anchor = g.Key.AnchorName, pinpais = g}; return Json(result, JsonRequestBehavior.AllowGet); } //根據(jù)品牌Id獲取車系 [HttpPost] public ActionResult GetCheXiByPId(int pid) { var allCheXi = Database.GetCarCategoriesByPId(pid).OrderBy(c => c.Id); var result = from c in allCheXi select new {chexi = c.Name, cxid = c.Id, parentId = c.PId}; return Json(result); } //根據(jù)車系Id獲取車型 [HttpPost] public ActionResult GetCheXingByCxId(int cxid) { var allCheXing = Database.GetCarCategoriesByPId(cxid).OrderBy(c => c.Id); var result = from c in allCheXing select new { chexing = c.Name, chexingid = c.Id, parentId = c.PId }; return Json(result); } }
在Home/Index.cshtml視圖中,品牌、車系、車型內(nèi)容都是先填充到tmpl模版中,然后追加到頁(yè)面某個(gè)區(qū)域上的。
@{ ViewBag.Title = "Index"; Layout = "~/Views/Shared/_Layout.cshtml"; } @section styles { <link href="~/Content/CarSelect.css" rel="external nofollow" rel="stylesheet" /> } <div class="input-group"> <input type="text" id="mychoice" class="form-control"> <span class="input-group-btn"> <button class="btn btn-default" type="button">∨</button> </span> </div> <div id="carcategory-picker-outer"> <a href="javascript:void(0)" rel="external nofollow" class="cancel"></a> <div id="carcategory-picker-inner"> <div id="pinpai" class="carcategory-list"> <h6>請(qǐng)選擇品牌</h6> <div id="PreLetter"> <a href="#aa" rel="external nofollow" >A</a> <a href="#bb" rel="external nofollow" >B</a> <a href="#cc" rel="external nofollow" >C</a> <a href="#dd" rel="external nofollow" >D</a> <a href="#ff" rel="external nofollow" >F</a> <a href="#gg" rel="external nofollow" >G</a> <a href="#hh" rel="external nofollow" >H</a> <a href="#jj" rel="external nofollow" >J</a> <a href="#kk" rel="external nofollow" >K</a> <a href="#ll" rel="external nofollow" >L</a> <a href="#mm" rel="external nofollow" >M</a> <a href="#nn" rel="external nofollow" >N</a> <a href="#oo" rel="external nofollow" >O</a> <a href="#qq" rel="external nofollow" >Q</a> <a href="#rr" rel="external nofollow" >R</a> <a href="#ss" rel="external nofollow" >S</a> <a href="#ww" rel="external nofollow" >W</a> <a href="#xx" rel="external nofollow" >X</a> <a href="#yy" rel="external nofollow" >Y</a> <a href="#zz" rel="external nofollow" >Z</a> </div> <div id="AllPinPai"> </div> </div> <div id="chexi" class="carcategory-list"> <h6>請(qǐng)選擇車系</h6> <div id="AllCheXi"> </div> </div> <div id="chexin" class="carcategory-list"> <h6>請(qǐng)選擇車型</h6> <div id="AllCheXing"> </div> </div> </div> </div> @section scripts { <script src="~/Scripts/jquery.tmpl.min.js"></script> <script type="text/javascript"> $(function() { //加載所有品牌 $.getJSON('@Url.Action("GetPinPai", "Home")', function(data) { $('#pinpaiTemplate').tmpl(data).appendTo('#AllPinPai'); }); //點(diǎn)擊input彈出品牌車系車型選擇 $('#mychoice').on("click", function() { $('#carcategory-picker-outer').css('display', 'block'); $("body").bind("mousedown", onBodyDown);//綁定鼠標(biāo)單擊事件 }); //點(diǎn)擊關(guān)閉按鈕隱藏品牌車系車型選擇 $('.cancel').on("click", function() { hideMenu(); }); //給所有品牌加上鼠標(biāo)移動(dòng)上事件 $('#AllPinPai').on("mouseover", ".ppm", function() { $(this).addClass('selected'); $('#chexi').css("display", "block"); $.post('@Url.Action("GetCheXiByPId","Home")', { 'pid': $(this).attr('pid') }, function (data) { $('#AllCheXi').empty(); $('#AllCheXing').empty(); $('#chexiTemplate').tmpl(data).appendTo('#AllCheXi'); }); }); //給所有品牌加上鼠標(biāo)移去事件 $('#AllPinPai').on("mouseout", ".ppm", function () { $(this).removeClass('selected'); }); //品牌點(diǎn)擊事件 $('#AllPinPai').on("click", ".ppm", function () { $('#mychoice').val(''); $('#mychoice').val($(this).text()); hideMenu(); }); //給車系加上鼠標(biāo)移動(dòng)上事件 $('#AllCheXi').on("mouseover", ".cxm", function () { //取取當(dāng)前車系的父類Id var parentId = $(this).attr('parentid'); //把品牌中該父類添加selected這個(gè)類 $('#AllPinPai').find("a[pid='" + parentId + "']").addClass('selected'); $(this).addClass('selected'); $('#chexin').css("display", "block"); $.post('@Url.Action("GetCheXingByCxId","Home")', { 'cxid': $(this).attr('pid') }, function (data) { $('#AllCheXing').empty(); $('#chexingTemplate').tmpl(data).appendTo('#AllCheXing'); }); }); //給車系加上鼠標(biāo)移去事件 $('#AllCheXi').on("mouseout", ".cxm", function () { $(this).removeClass('selected'); //取取當(dāng)前車系的父類Id var parentId = $(this).attr('parentid'); //把品牌中該父類添加selected這個(gè)類 $('#AllPinPai').find("a[pid='" + parentId + "']").removeClass('selected'); }); //車系點(diǎn)擊事件 $('#AllCheXi').on("click", ".cxm", function () { $('#mychoice').val(''); //取取當(dāng)前車系的父類Id var parentId = $(this).attr('parentid'); $('#mychoice').val($('#AllPinPai').find("a[pid='" + parentId + "']").text() + "," + $(this).text()); hideMenu(); }); //給車型加上鼠標(biāo)移上事件 $('#AllCheXing').on("mouseover", ".cxim", function () { //取出車型的父類id var parentId = $(this).attr('parentid'); //把車系中該父類添加selected這個(gè)類 $('#AllCheXi').find("a[pid='" + parentId + "']").addClass('selected'); //取出車系的父類id var parentparentId = $('#AllCheXi').find("a[pid='" + parentId + "']").attr('parentid'); //把品牌中該父類添加selected這個(gè)類 $('#AllPinPai').find("a[pid='" + parentparentId + "']").addClass('selected'); }); //給車型加上鼠標(biāo)移去事件 $('#AllCheXing').on("mouseout", ".cxim", function () { //取出車型的父類id var parentId = $(this).attr('parentid'); //把車系中該父類添加selected這個(gè)類 $('#AllCheXi').find("a[pid='" + parentId + "']").removeClass('selected'); //取出車系的父類id var parentparentId = $('#AllCheXi').find("a[pid='" + parentId + "']").attr('parentid'); //把品牌中該父類添加selected這個(gè)類 $('#AllPinPai').find("a[pid='" + parentparentId + "']").removeClass('selected'); }); //車型點(diǎn)擊事件 $('#AllCheXing').on("click", ".cxim", function () { $('#mychoice').val(''); //取出車型的父類id var parentId = $(this).attr('parentid'); //取出車系的父類id var parentparentId = $('#AllCheXi').find("a[pid='" + parentId + "']").attr('parentid'); $('#mychoice').val($('#AllPinPai').find("a[pid='" + parentparentId + "']").text() + "," + $('#AllCheXi').find("a[pid='" + parentId + "']").text() + "," + $(this).text()); hideMenu(); }); }); //隱藏樹并解除綁定 function hideMenu() { $("#carcategory-picker-outer").fadeOut("fast"); $("body").unbind("mousedown", onBodyDown); } //鼠標(biāo)單擊空白處事件 function onBodyDown(event) { if (!(event.target.id == "mychoice" || event.target.id == "carcategory-picker-outer" || $(event.target).parents("#carcategory-picker-outer").length > 0)) { hideMenu(); } } </script> <script id="pinpaiTemplate" type="text/x-jQuery-tmpl"> <dl> <dt id="${anchor}">${firstletter}</dt> {{if pinpais}} {{each pinpais}}<dd><a class="ppm" pid="${$value.Id}">${$value.Name}</a></dd>{{/each}} {{else}} <dd>沒(méi)有此品牌</dd> {{/if}} </dl> </script> <script id="chexiTemplate" type="text/x-jQuery-tmpl"> <dl> <dd><a class="cxm" pid="${cxid}" parentid="${parentId}">${chexi}</a></dd> </dl> </script> <script id="chexingTemplate" type="text/x-jQuery-tmpl"> <dl> <dd><a class="cxim" pid="${chexingid}" parentid="${parentId}">${chexing}</a></dd> </dl> </script> }
css部分如下,關(guān)閉按鈕可自找。
#carcategory-picker-outer { background: #f9f9f9; padding: 10px; width: 640px; height: 380px; position: relative; display: none; } #PreLetter { border: 0px solid blue; width: 21px; float: left; } #PreLetter a:link{ display: block; text-decoration: none; clear: both; font-size: 10px; text-align: center; padding-top: 0px; border: 1px solid #e3e3e3; width: 15px; height: 15px; background-color: #e9e9e9; margin-top: 2px; font-weight: bold; } #PreLetter a:hover { border: 1px solid blue; } #PreLetter a:visited { border: 1px solid #e3e3e3; } #pinpai { border: 0px solid green; float: left; } #AllPinPai { border: 1px solid #e3e3e3; margin-left: 5px; float: left; padding-bottom: 0px; width: 120px; height: 340px; overflow-y: auto; } #AllPinPai dl dd a { text-decoration: none; display: block; padding-left: 10px; } #AllPinPai dl dd { padding-left: 0px; } #AllPinPai dl dd a:hover { /*background-color: gray;*/ color: white; } #AllPinPai dl { margin-bottom: 5px; } #chexi { border: 0px solid orange; float: left; margin-left: 10px; display: none; } #AllCheXi { width: 150px; height: 340px; overflow-y: auto; border: 1px solid #e3e3e3; } #AllCheXi dl dd a { text-decoration: none; display: block; padding-left: 10px; } #AllCheXi dl dd { padding-left: 0px; } #AllCheXi dl dd a:hover { color: white; } #AllCheXi dl { margin-bottom: 5px; } #chexin { border: 0px solid red; float: left; margin-left: 10px; display: none; } #AllCheXing { width: 300px; height: 340px; overflow-y: auto; border: 1px solid #e3e3e3; } #AllCheXing dl dd a { text-decoration: none; display: block; padding-left: 10px; } #AllCheXing dl dd { padding-left: 0px; } #AllCheXing dl dd a:hover { background-color: gray; color: white; } #AllCheXing dl { margin-bottom: 5px; } dt { background-color: #e9e9e9; padding-left: 10px; } dl { border: 0px solid red; } dd { padding-left: 10px; line-height: 15px; margin-top: 5px; margin-bottom: 0px; border: 0px solid blue; /*background-color: gray;*/ } .selected { background-color: gray; color: white; } .cancel { width: 20px; height: 17px; position: absolute; display: block; top: 20px; right: 20px; background-image: url("../img/close.png"); border: 1px solid orangered; background-color: orangered; } .input-group { width: 640px; }
以上就是這篇文章的全部?jī)?nèi)容了,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,謝謝大家對(duì)腳本之家的支持。如果你想了解更多相關(guān)內(nèi)容請(qǐng)查看下面相關(guān)鏈接
相關(guān)文章
.net c# gif動(dòng)畫如何添加圖片水印實(shí)現(xiàn)思路及代碼
本文將詳細(xì)介紹下c#實(shí)現(xiàn)gif動(dòng)畫添加圖片水印,思路很清晰,感興趣的你可以參考下哈,希望可以幫助到你2013-03-03asp.net實(shí)現(xiàn)根據(jù)城市獲取天氣預(yù)報(bào)的方法
這篇文章主要介紹了asp.net實(shí)現(xiàn)根據(jù)城市獲取天氣預(yù)報(bào)的方法,涉及asp.net調(diào)用新浪接口獲取天氣預(yù)報(bào)信息的實(shí)現(xiàn)技巧,非常簡(jiǎn)單實(shí)用,需要的朋友可以參考下2015-12-12詳解ASP.NET Core 之 Identity 入門(三)
本篇文章主要介紹了ASP.NET Core 之 Identity 入門,主要負(fù)責(zé)對(duì)用戶的身份進(jìn)行認(rèn)證,有興趣的可以了解一下。2016-12-12asp.net 動(dòng)態(tài)表單之?dāng)?shù)據(jù)分頁(yè)
我們很常會(huì)在項(xiàng)目中提到一個(gè)動(dòng)態(tài)表單的概念,比如學(xué)校里面學(xué)生的考試成績(jī),當(dāng)學(xué)生登錄系統(tǒng)的時(shí)候,他當(dāng)然是希望看到他自己所有科目的成績(jī);又或者是班主任,他需要看到本班同學(xué)所有科目的成績(jī);這些時(shí)候我們一般都會(huì)在頁(yè)面中呈現(xiàn)如下的效果。2010-03-03Asp.net(C#)讀取數(shù)據(jù)庫(kù)并生成JS文件制作首頁(yè)圖片切換效果(附demo源碼下載)
這篇文章主要介紹了Asp.net(C#)讀取數(shù)據(jù)庫(kù)并生成JS文件制作首頁(yè)圖片切換效果的方法,涉及asp.net數(shù)據(jù)庫(kù)操作及JavaScript幻燈片生成的相關(guān)技巧,并附帶demo源碼供讀者下載參考,需要的朋友可以參考下2016-04-04.NET5實(shí)現(xiàn)操作注冊(cè)表的方法
本文詳細(xì)講解了.NET5實(shí)現(xiàn)操作注冊(cè)表的方法,文中通過(guò)示例代碼介紹的非常詳細(xì)。對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2022-02-02asp.net Menu控件+SQLServer實(shí)現(xiàn)動(dòng)態(tài)多級(jí)菜單
asp.net Menu控件+SQLServer實(shí)現(xiàn)動(dòng)態(tài)多級(jí)菜單的代碼,需要的朋友可以參考下。2011-12-12.NetCore使用ImageSharp進(jìn)行圖片的生成
ImageSharp是對(duì)NetCore平臺(tái)擴(kuò)展的一個(gè)圖像處理方案,以往網(wǎng)上的案例多以生成文字及畫出簡(jiǎn)單圖形、驗(yàn)證碼等方式進(jìn)行探討和實(shí)踐,今天我分享一下所在公司項(xiàng)目的實(shí)際應(yīng)用案例,導(dǎo)出微信二維碼圖片,圓形頭像,感興趣的朋友一起看看吧2022-06-06