menu-add2.html

最新推荐文章于 2021-10-20 15:46:08 发布
原创 最新推荐文章于 2021-10-20 15:46:08 发布 · 297 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY 版权协议，转载请附上原文出处链接和本声明。

本文介绍了一个网站后台管理模版的设计与实现，包括HTML结构、样式引用、表单元素及交互逻辑，展示了如何使用layui框架进行表单验证和提交处理。 
<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title>网站后台管理模版</title>
		<link rel="stylesheet" type="text/css" href="../../static/admin/layui/css/layui.css" />
		<link rel="stylesheet" type="text/css" href="../../static/admin/css/admin.css" />
	</head>
	<body>
		<div class="wrap-container">
				<form class="layui-form" style="width: 90%;padding-top: 20px;">
					<div class="layui-form-item">
						<label class="layui-form-label">菜单分类：</label>
						<div class="layui-input-block">
							<select name="category" lay-verify="required">
								<option value="0">作为顶级菜单</option>
								<option value="010">关于我们</option>
								<option value="021">产品中心</option>
								<option value="021">新闻中心</option>
								<option value="021">业务范围</option>
								<option value="021">联系我们</option>
								<option value="021">在线留言</option>
							</select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">父级：</label>
						<div class="layui-input-block">
							<select name="category2" lay-verify="required">
								<option value="0">/</option>
								<option value="010">首页</option>
								<option value="010">关于我们</option>
								<option value="021">产品中心</option>
								<option value="021">新闻中心</option>
								<option value="021">业务范围</option>
								<option value="021">联系我们</option>
								<option value="021">在线留言</option>
							</select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">标签：</label>
						<div class="layui-input-block">
							<input type="text" name="label" required lay-verify="required" placeholder="请输入标签" autocomplete="off" class="layui-input" value="关于我们">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">内部跳转：</label>
						<div class="layui-input-block">
							<select name="link1">
								<option value="">请选择跳转项</option>
							  <optgroup label="栏目">
							    <option value="010">首页</option>
								<option value="010">关于我们</option>
								<option value="021">产品中心</option>
								<option value="021">新闻中心</option>
							  </optgroup>
							  <optgroup label="单页">
							    <option value="021">业务范围</option>
								<option value="021">联系我们</option>
								<option value="021">在线留言</option>
							  </optgroup>
							</select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">外部链接：</label>
						<div class="layui-input-block">
							<input type="text" name="link2" required lay-verify="required" placeholder="请输入外部链接" autocomplete="off" class="layui-input">
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">打开方式：</label>
						<div class="layui-input-block">
							<select name="category" lay-verify="required">
								<option value="0">默认</option>
								<option value="010">新窗口打开</option>
								
							</select>
						</div>
					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">图标：</label>
						<div class="layui-input-block">
							<input type="text" name="title" required lay-verify="required" placeholder="请输入图标" autocomplete="off" class="layui-input">
						</div>

					</div>
					<div class="layui-form-item">
						<label class="layui-form-label">状态：</label>
						<div class="layui-input-block">
							<input type="radio" name="status" value="1" title="显示" checked>
							<input type="radio" name="status" value="0" title="隐藏">
						</div>

					</div>

					<div class="layui-form-item">
						<div class="layui-input-block">
							<button class="layui-btn layui-btn-normal" lay-submit lay-filter="formDemo">立即提交</button>
							<button type="reset" class="layui-btn layui-btn-primary">重置</button>
						</div>
					</div>
				</form>
		</div>

		<script src="../../static/admin/layui/layui.js" type="text/javascript" charset="utf-8"></script>
		<script>
			//Demo
			layui.use(['form'], function() {
				var form = layui.form();
				form.render();
				//监听提交
				form.on('submit(formDemo)', function(data) {
					layer.msg(JSON.stringify(data.field));
					return false;
				});
			});
		</script>
	</body>

</html>
精选资源
vue-context-menu-vue js的上下文菜单组件。-Vue.js开发
05-27
yarn add vue-context-menu ``` 然后，在你的Vue组件中引入并注册这个插件： ```javascript import Vue from 'vue'; import VueContextMenu from 'vue-context-menu'; Vue.use(VueContextMenu); ``` 在模板中，...
jquery-ui.min.js 插件
lllllllllaaa的博客
09-02 1万+
1、导入js库： script src="//apps.bdimg.com/libs/jqueryui/1.10.4/jquery-ui.min.js">script>       2、用法： 附赠案例一份： html> html> head lang="en">     meta charset="UTF-8">     title>折叠title>     script
《前端》引用包sidebar-menu.js源码及使用
BelleDiao的博客
06-29 1761
sidebar-menu.js源码： (function ($) { $.fn.sidebarMenu = function (options) { options = $.extend({}, $.fn.sidebarMenu.defaults, options || {}); var target = $(this); target.addClass('nav'); target.addClass('nav-list'); if (options.data) { init
Java -Dfile.encoding=UTF-8的使用
haixia_12的专栏
01-05 2万+
原文地址：http://blog.sina.com.cn/s/blog_4ce8808d0101d0i1.html Java -Dfile.encoding=UTF-8  遭遇乱码问题的来龙去脉 如下使用：java -XX:MaxPermSize=256M -Dfile.encoding=UTF-8 -Xbootclasspath/a:./acc/library/fc
bootstrap 流式布局 引入文件 bootstrap-combined.min.css
旋转的紫色星系
08-13 1万+
流式布局 创建一个流式、两栏的布局, 只需要—这非常适合应用于程序和文档类的网站。
ROS之choro功能包
热门推荐
zhangrelay的专栏
07-27 3万+
使用choro可以快速查找管理功能包，类似ubuntu的apt。 非常方便快捷。 如下： C:\ros_ws>choco search ros-foxy-desktop Chocolatey v0.10.15 ros-foxy-desktop 20201211.0.0.2104300001 1 packages found. 简洁版： ros-catkin-tools 0.0.1.1903221831 ros-cmake 3.11.4.1809242322 ros-colcon-too
vim常用设置---(.vimrc详细配置)
lovewebeye的专栏
04-16 3万+
.vimrc配置文件内容如下:""""""""""""""""""""""""""""""""""""""""&
关于element-plus中el-menu或者el-menu-item导致无法跳转问题或者无法路由或闪动问题解决方法
weixin_45917610的博客
10-20 1万+
原本界面:我出现的点击首页没有跳转，而点击其他的就跳转 原本的代码： 下面展示一些 内联代码片。 <el-menu background-color="#545c64" text-color="#fff" active-text-color="#ffd04b" > <el-menu-item index="/
一、我来说LuCI: LuCI官方----3. Theme and Modules
不以己悲的博客
11-04 8406
中文总结： 1. 安装包对应目录：     ipkg   -- ipkg安装包配置     htdocs -- /www     luasrc -- /usr/lib/lua/luci     root -- linux根目录     src -- C code     lua -- /usr/lib/lua     dist -- 2. Makefile:     $(eva
Android 4.03 编译系统------envsetup.sh
wowo的专栏
08-21 3502
接触Android的也快半年了，一直都忙着学习android 的framework、HAL，对Android的编译系统一点都不了解，在编译系统时带来了很多的不便，所以花时间详细的了解了一下，下面记录一下学习心得(由于时间仓促，有的地方理解有误，请不吝赐教)。         Android编译环境的建立以及源码的下载，Android官网给了详细的说明：http://source.android.
bookshelf.html5.qq.com,BaiduBrowser.apk 5% 的杀毒软件(2/39) 报告发现病毒 - VirSCAN.org-多引擎在线病毒扫描网 v1.02，当前支持 47...
weixin_42168750的博客
06-21 1万+
文件列表文件名校验码META-INF/MANIFEST.MF0x59c717feMETA-INF/BDMOBILE.SF0x66122fe2META-INF/BDMOBILE.RSA0x645f957cassets/about/about_banner.png0x8d3f2c9aassets/about/about_cache.dat0xe32e5f04assets/about/about_int...
Laravel开发-laravel-menu .zip
10-05
$menu->add(Link::to('/contact', 'Contact'))->addClass('highlight'); }); ``` 这段代码会创建一个名为`myMenu`的菜单，并添加三个链接：主页、关于我们和联系我们。`addClass`方法用于为特定菜单项添加CSS类。 ...
Laravel开发-laravel-menu (2).zip
10-05
在本压缩包“Laravel开发-laravel-menu (2).zip”中，主要涉及的是使用Laravel框架进行Web应用开发时，如何集成并使用laravel-menu库来构建网站的菜单系统。Laravel是一款流行的PHP框架，它以其优雅的语法和丰富的...
Laravel开发-laravel-active .zip.zip
10-05
$menu->add('关于我们', ['route' => 'about'])->activeIfRequestMatches('/^about/'); }); ``` 在视图中，你只需要渲染这个菜单即可： ```blade {{ Menu::get('MyMenu')->render() }} ``` 总结起来，Laravel的...
551515151和vu给vuvuvuvu
12-20
595959595959595959hi吧hi哔哔哔iubi
论文复现一种基于价格弹性矩阵的居民峰谷分时电价激励策略需求响应（Matlab代码实现）
12-20
【论文复现】一种基于价格弹性矩阵的居民峰谷分时电价激励策略【需求响应】（Matlab代码实现）内容概要：本文介绍了一种基于价格弹性矩阵的居民峰谷分时电价激励策略，旨在通过需求响应机制优化电力系统的负荷分布。该研究利用Matlab进行代码实现，构建了居民用电行为与电价变动之间的价格弹性模型，通过分析不同时间段电价调整对用户用电习惯的影响，设计合理的峰谷电价方案，引导用户错峰用电，从而实现电网负荷的削峰填谷，提升电力系统运行效率与稳定性。文中详细阐述了价格弹性矩阵的构建方法、优化目标函数的设计以及求解算法的实现过程，并通过仿真验证了所提策略的有效性。; 适合人群：具备一定电力系统基础知识和Matlab编程能力，从事需求响应、电价机制研究或智能电网优化等相关领域的科研人员及研究生。; 使用场景及目标：①研究居民用电行为对电价变化的响应特性；②设计并仿真基于价格弹性矩阵的峰谷分时电价激励策略；③实现需求响应下的电力负荷优化调度；④为电力公司制定科学合理的电价政策提供理论支持和技术工具。; 阅读建议：建议读者结合提供的Matlab代码进行实践操作，深入理解价格弹性建模与优化求解过程，同时可参考文中方法拓展至其他需求响应场景，如工业用户、商业楼宇等，进一步提升研究的广度与深度。
Android WebView 部分手机显示不全
最新发布
12-20
源码地址： https://pan.quark.cn/s/e46927981684 AdvancedWebView Enhanced WebView component for Android that works as intended out of the box Requirements * Android 2.2+ Installation * Add this library to your project * Declare the Gradle repository in your root * Declare the Gradle dependency in your app module's Usage AndroidManifest.xml Layout (XML) Activity (Java) Without Fragments With Fragments () Note: If you're using the class from the support library (), please refer to the next section (see below) instead of this one. With Fragments from the support library () * Use the code for normal usage as shown above * Change to * Add the following code to the parent in order to forward the results from the to the appropriate instance ProGu...
基于WesMcKinney所著PythonforDataAnalysis3rdEdition开放获取网络版进行完整准确忠实翻译并本地化处理的中文Markdown.zip
12-20
基于WesMcKinney所著PythonforDataAnalysis3rdEdition开放获取网络版进行完整准确忠实翻译并本地化处理的中文Markdown.zip
基于AUTOSAR的英飞凌TC275单片机Bootloader工程源码实现
12-20
针对TC275微控制器平台，基于AUTOSAR标准的引导加载程序实现方案 本方案详细阐述了一种专为英飞凌TC275系列微控制器设计的引导加载系统。该系统严格遵循汽车开放系统架构（AUTOSAR）规范进行开发，旨在实现可靠的应用程序刷写与启动管理功能。 核心设计严格遵循AUTOSAR分层软件架构。基础软件模块（BSW）的配置与管理完全符合标准要求，确保了与不同AUTOSAR兼容工具链及软件组件的无缝集成。引导加载程序本身作为独立的软件实体，实现了与上层应用软件的完全解耦，其功能涵盖启动阶段的硬件初始化、完整性校验、程序跳转逻辑以及通过指定通信接口（如CAN或以太网）接收和验证新软件数据包。 在具体实现层面，工程代码重点处理了TC275芯片特有的多核架构与内存映射机制。代码包含了对所有必要外设驱动（如Flash存储器驱动、通信控制器驱动）的初始化与抽象层封装，并设计了严谨的故障安全机制与回滚策略，以确保在软件更新过程中出现意外中断时，系统能够恢复到已知的稳定状态。整个引导流程的设计充分考虑了时序确定性、资源占用优化以及功能安全相关需求，为汽车电子控制单元的固件维护与升级提供了符合行业标准的底层支持。 资源来源于网络分享，仅用于学习交流使用，请勿用于商业，如有侵权请联系我删除！
.el-menu-item.is-active如何只给没有子元素的菜单
11-22
在HTML和CSS中，`.el-menu-item.is-active` 是Eleme UI（Element UI）中的一个类名，用于标识当前选中的导航菜单项。如果你想仅给那些没有子元素的菜单项添加这个样式，你可以这样做： 1. 首先，在CSS中，你可以为`.el-menu-item`设置默认样式，并在`.el-menu-item.is-active`中添加激活状态下的样式。例如： ```css .el-menu-item { /* 默认样式 */ } .el-menu-item.is-active { /* 激活状态样式，如背景颜色、边框等 */ } ``` 2. 然后，在JavaScript或Vue.js中，检查每个`.el-menu-item`是否有子元素，如果没有则应用`.is-active`类。假设你正在使用Vue.js： ```javascript <template> <div ref="menuItems"></div> </template> <script> export default { mounted() { this.$refs.menuItems.forEach(item => { if (!item.children) { // 如果没有子元素 item.classList.add('is-active'); } }); }, }; </script> ``` 这里使用了 Vue 的 `ref` 和 `forEach` 来遍历菜单项并判断是否需要添加 `.is-active` 类。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值