前端
散装程序猿
先做人,再做技术人员,最后做程序员。
展开
-
vue实现省市县三级联动
大概就是这样一个格式的数组。需要根据自己的业务需要存储。传值的话,默认是传的array。原创 2023-06-27 11:15:44 · 783 阅读 · 0 评论 -
element的时间控件默认值为当前时间
但是这样时间是带毫秒的,后台就需要对传递的事件类型进行格式化处理。在你需要进行赋值操作的页面 给这个时间字段附上值 就ok了。首先在return里边定义一个参数放当前时间。也可以直接将字段赋值为new date();在methods写一个方法给这个参数赋值。原创 2023-06-27 11:07:57 · 1577 阅读 · 0 评论 -
bootstrapTable表格自定义每列数据的宽度
使用若依框架搭建的管理后台,因为table是封装好的。表格的宽度是自适应的。就想着在网上找一下属性,看能不能设置一下每一列数据的宽度。输入的稍微长一点就会这样。原创 2023-02-07 15:10:09 · 3994 阅读 · 1 评论 -
freemarker的逻辑判断(if)和集合遍历(list)
listfreemarker获取list的size :${list?size}list的遍历:<#list animals as being> <tr> <td>${being.name}${being.price}<td> </tr></#list>map的遍历:<#list map?keys as k> <option value="${k}"&g原创 2021-06-23 15:45:59 · 2840 阅读 · 0 评论 -
登录的时候 实现记住密码
项目中基本上登录是必不可少的一步,对此,在登录时选择记住密码这一功能也是不错的选择。今天测试找我说项目中的记住密码功能没用。我一看前同事就没写这一块的代码。搞了个复选框丢在哪里就没管。先引入需要的js文件。<script src="../static/js/jquery.min.js" th:src="@{/js/jquery.min.js}"></script><script src="../static/js/jquery.cookie.js" th:src="@{原创 2021-05-13 17:55:24 · 1018 阅读 · 0 评论 -
swiper插件修改按钮的默认样式
网上找了很久,只有关于修改颜色的方法。没有找到实用的修改按钮样式的方法。就自己想了个办法。很简单。思路:swiper原来的样式不是能修改颜色嘛,那就将箭头的颜色设置为透明的。然后给箭头的div添加一个图片背景以达到修改按钮样式的目的。代码: .swiper-button-next { /*先将原始箭头的颜色设置为透明的 然后设置一个背景图片 达到修改按钮样式的目的*/ right: 1.5%; left: auto;原创 2021-05-11 17:30:21 · 3245 阅读 · 0 评论 -
swiper调整左右滑动按钮的位置
swiper本来的左右滑动按钮是跟slide重合的。先看一下最终效果:说一下大概的思路。就是在swiper容器的最外层再加一层div 然后把左右滑动的按钮放在跟swiper平级。代码:css: .swiper-father { width: 80%; height: 15%; top:75%; margin-left: auto; margin-right: auto原创 2021-05-08 14:48:32 · 3096 阅读 · 0 评论 -
使用swiper制作轮播类型的button按钮组
效果截图:最终要实现的功能是,每个按钮标识一个房间名字,点击某一个按钮 自动定位到所选房间。选用swiper主要是因为简单,而且支持手势拖动需要引入的资源:<link href="/assets/plugins/swiper/swiper-bundle.min.css" rel="stylesheet"><script src="/assets/plugins/swiper/swiper-bundle.min.js"></script>去swiper官网原创 2021-04-21 09:53:12 · 854 阅读 · 0 评论 -
Freemarker接收ModelAndView传递返回值并判断否为空方法
freemarker中显示某对象使用${name}.但如果name为null,freemarker就会报错。如果需要判断对象是否为空可以通过设置默认值${name!’’}来避免对象为空的错误。如果name为空,就以默认值(“!”后的字符)显示。对象user,name为user的属性的情况,user,name都有可能为空,那么可以写成 ${(user.name)!’’},表示user或者name为null,都显示为空。判断为空<input hidden="hidden" id="defX"转载 2021-04-20 11:31:59 · 1155 阅读 · 0 评论 -
bootstrap table组件实现父子表【菜单管理】
实现的效果:前端代码:<!DOCTYPE HTML><html lang="zh-cn" xmlns="http://www.w3.org/1999/html"><head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=devi原创 2021-04-09 17:47:54 · 1506 阅读 · 2 评论 -
百度地图BMap.Autocomplete地址关键字提示下拉框被覆盖的解决办法
我们在使用百度地图关键字输入提示功能自动补全地址时可能会遇到地址关键字提示下拉框被覆盖的问题,如下图:解决方法是在你HTML页面文件的head标签内重写如下CSS代码,.tangram-suggestion-main是百度地图关键字提示下拉框的CSS样式,通常我们的下拉框被覆盖了是因为下拉框的z-index值比页面中其他部分z-index的值小,这个z-index表示垂直屏幕的距离,我们尽可能把下拉框的z-index设置大一点就好了。直接在你的head标签内复制粘贴这段代码就能解决问题。<st转载 2021-02-25 11:25:30 · 1038 阅读 · 2 评论 -
动态添加 删除 input输入框(百度地图路线规划后续)
html: <div class="pos-a" id="allmap" style="width: 100%; height: 95.5%;"> </div> <div id="up-map-div"> <form class="form form-horizontal" id="formSubmit" action="${rootPath}/back/permit/insertclxslx.htm"> <div>原创 2021-02-24 16:12:10 · 229 阅读 · 1 评论 -
【百度地图API】制作多途经点的线路导航
先创建一张地图的容器: <div class="pos-a" id="allmap" style="width: 100%; height: 95.5%;"> </div>然后实例化地图: var map = new BMap.Map('allmap'); map.centerAndZoom(new BMap.Point(116.404, 39.915), 11); map.enableScrollWheelZoom(true);创建几个坐标点原创 2021-02-23 17:25:23 · 2590 阅读 · 1 评论 -
input输入框动态提示,输入框+下拉框(DataList)
要做一个类似于百度搜索框的那种 输入关键字段 可以自动提示在网上找了好多的例子都试了试。好几个利用jQuery的都不行,没有成功。可是却无意间发现了一个input输入框自动提示神器 DataListDataList的表现很像是一个Select下拉列表,但它只是提示作用,并不限制用户在input输入框里输入什么。 HTML5 Datalist的语法其实跟select下拉列表的语法几乎完全一样,非常的简单!设备生产厂家:<input type="text" name="sbsccj" id=""原创 2021-01-22 17:31:06 · 5514 阅读 · 2 评论 -
2021年春节倒计时代码
效果还可以,不丑,想自己改改可以改,春节时间可以更改,年年都能用<!DOCTYPE HTML><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>春节倒计时</title></head><body><div> <h1><font colo.转载 2021-01-11 14:26:26 · 5047 阅读 · 2 评论 -
HTML中使标签鼠标放上去时显示手形状
在css中加入一行代码:cursor:pointer;原创 2020-11-10 10:13:42 · 1261 阅读 · 0 评论 -
百度地图实现地图全屏(放大页面全屏)
这个全屏 API里面没有。是因为全屏只是个产品逻辑,把地图外的其他div隐藏,然后把地图的width设置为页面最大像素就可以了。是js和css的技术,和API无关先定义一个按钮获取按钮元素 ,写全屏逻辑代码//全屏 var btn = document.getElementById('btn'); btn.onclick = function(e){ if(document.getElementById("box-center").style.widt原创 2020-10-19 14:38:42 · 7954 阅读 · 0 评论 -
echarts图表浏览器窗口缩放,图表自适应
今天在整一个首页的时候,发现浏览器缩小之后。echarts图表还是原来大小。直接占据了其他内容的位置。作为一个合格的开发者。这是绝对不能容忍的事情。虽然不是专业前端。可是还是忍受不了。就百度去找为什么不会自适应。** 造成不能自适应的原因: **echarts的图表实例事实上并没有主动的去绑定resize()事件,就是说显示区域大小发生改变内部并不知道,当你需要去做一些自适应的效果的时候,需要使用方主动的去绑定这个事件达到自适应的效果,常见如window.onresize = myChart.resi原创 2020-09-28 11:27:17 · 1528 阅读 · 0 评论 -
省市县 三级联动
省市区数据库级联查询前端代码:<div class="row cl"> <label class="form-label col-xs-4 col-sm-2"><span class="c-red">*</span>地区:</label> <div class="formControls col-xs-8 col-sm-9"> <input type="hidden" name="re原创 2020-09-09 10:20:56 · 319 阅读 · 0 评论 -
复选框数据回显因为两个forEach循环导致数据重负
今天在搞一个标签功能,一对多。所以就用复选框搞。可是前端真的对我来说。。。。。。。。真的是一点点摸索~先放一小部分截图吧~现在是想要让在添加标签页面能有个默认值。就是数据回显。因为它本身是有值的。需要让用户客观的知道哪些标签还没有呗选择。但是…想要回显的话 就面不了两个foreEach循环嵌套:这一嵌套数据就重复了。咳咳~~ 实在是不太精通前端! 如果是我哪里操作失误了。麻烦告知 ~我试了很多的方法,多没有办法规避这个重复的问题。最后想着只写一层循环 在js中给in原创 2020-08-07 15:47:46 · 469 阅读 · 0 评论 -
复选框美化(去√,复选按钮,图片单选框)
效果图:css:<style type="text/css">.RadioStyle input{ display: none;}.RadioStyle label{ border: 1px solid #adadad; padding: 2px 10px 2px 5px; line-height: 28px; min-width: 80px; text-align: center; float: left; ma原创 2020-08-07 09:56:44 · 351 阅读 · 0 评论 -
input标签type=“week“选择第几周
今天在做统计报表页面的时候,有一个问题。需要按照周条件搜索。天 月 年原来都做过,直接type="date"然后format一下就行了。但是没弄过按周查询的。就自己查资料,慢慢搞!HTML5 拥有多个可供选取日期和时间的新输入类型:date:选取日、月、年month:选取月、年week:选取周和年time:选取时间(小时和分钟)datetime-local:选取时间、日、月、年(本地时间)datetime:选取时间、日、月、年(在有些浏览器内失效,选用datetime-local)&原创 2020-07-14 14:05:43 · 2112 阅读 · 0 评论 -
利用百度地图绘制区域(限行区)——问题补充
之前写过一篇利用百度地图 绘制区域方位的方法:https://blog.csdn.net/qq_42684504/article/details/105860388现在过去也有一段时间了,突然失效不管用了。我清楚的记得之前是好好的。绝对没有问题。然后就开始一点点的排查。最后发现,百度地图api中返回的区域参数跟之前不一样了。就是这个地方。好像是过一段时间,这个就会发生变化:记录一下自己查找问题的过程:先浏览器打开项目,找到回去区域的页面。F12打开调试功能。然后找到这个地方:找个地方原创 2020-07-13 09:37:06 · 561 阅读 · 0 评论 -
c:if标签判断字符串值相等
今天在写从后端传值判断显示的时候,代码如下。<div class="row cl"> <label class="form-label col-xs-4 col-sm-2">东侧机动车灯类型:</label> <c:if test="${requestScope.eastVeh eq '0,0,0' }"></c:if> <c:if test="${requestScope.eastVeh eq '0,3,0' }"><i原创 2020-07-10 09:38:52 · 2588 阅读 · 1 评论