JavaScript - 教程之家

52浏览

0评论

layui 地区三级联动 form select 渲染的实例

如下所示：html <div class="layui-form-item"> <label class="layui-form-label require_start"><span>所在城市 :</span></label> <div class="layu...

2020-05-27

79浏览

0评论

解决layui中onchange失效以及form动态渲染失效的问题

最近在使用layui框架做城市的三级级联的时候，发现jquery中的onchange事件方法在layui框架中失效了。然后浏览layui社区，了解到layui监控一个控件变化有自己的方法。html<selec...

2020-05-27

103浏览

0评论

vue实现购物车小案例

本文实例为大家分享了vue实现购物车小案例的具体代码，供大家参考，具体内容如下最终效果HTML部分：<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>shopc...

2020-05-27

178浏览

0评论

微信小程序动态修改页面数据及参数传递过程详解

在小程序中我们经常要动态渲染数据，对于新手而言我们常常遇到修改的数据在控制台显示和页面显示不一致，因为我们用“=”修改数据的，这种是可以修改，但无法改变页面的状态的，还会...

2020-05-27

74浏览

0评论

vue实现文字加密功能

本文实例为大家分享了vue实现文字加密功能的具体代码，供大家参考，具体内容如下效果：组件代码： base64npm install --save js-base64md5npm install --save js-md5<template> <di...

2020-05-27

79浏览

0评论

vue监听用户输入和点击功能

本文实例为大家分享了vue监听用户输入和点击的具体代码，供大家参考，具体内容如下功能1：监听用户输入和点击，并实时显示，功能2：点击发布，编辑页面隐藏，显示发布成功。功能1 html代码：...

2020-05-27

67浏览

0评论

JavaScript实现背景自动切换小案例

本文实例为大家分享了js实现背景自动切换的具体代码，供大家参考，具体内容如下功能：窗口打开背景图自动跳转切换所有代码：<!DOCTYPE html><html lang="en"><head> <meta charset=...

2020-05-27

95浏览

0评论

微信小程序冒泡事件原理解析

在微信小程序的事件分为冒泡事件和非冒泡事件：冒泡事件：当一个组件上的事件被触发后，该事件会向父节点传递。
非冒泡事件：当一个组件上的事件被触发后，该事件不会向父节点传递。...

2020-05-27

59浏览

0评论

ligerUI的ligerDialog关闭刷新的方法

前几天写代码的时候用到了ligerUI的弹窗功能，然后需要在关闭弹窗的时候异步刷新页面，但是查看API的时候发现没有相关的时间或者方法。然后一个个查看参数，发现了一个叫“cls”...

2020-05-27

97浏览

0评论

简单了解微信小程序 e.target与e.currentTarget的不同

在小程序的点击事件中，我们经常使用这两个属性来传参，看起来效果一样，查了官方文档如下：target：事件源组件对象currentTarget：当前组件对象什么意思？我刚开始就有点不懂，那就直接上...

2020-05-27

72浏览

0评论

layer.alert自定义关闭回调事件的方法

在项目应用中，遇到自定义关闭layer.alert弹出层，即在关闭layer.alert时，可以自动触发关闭时的事件，具体方法为：layer.alert('爱心提示！', function(){ 自定义关闭时调用的事件});...

2020-05-27

105浏览

0评论

layer弹出层倒计时关闭的实现方法

因为官方没有提供，只能自己实现了，包括按钮倒计时和标题倒计时，标题倒计时在注释部分：<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> </head>...

2020-05-27

96浏览

0评论

JavaScript实现随机五位数验证码

本文实例为大家分享了js实现随机五位数验证码的具体代码，供大家参考，具体内容如下功能展示：
点击按钮，随机生成数字+大小写字母验证码
所有代码：<!DOCTYPE html><html><head><met...

2020-05-27

81浏览

0评论

使用layer模态框给新页面传值的方法

昨天用hui后台模板的时候用到模态框传值给另一个新页面模板是这么写的没办法给新页面传值，于是百度了一下，总结function zhuyuan(title,url,id,w,h,type){ layer.open({...

2020-05-27

91浏览

0评论

layer页面跳转,获取html子节点元素的值方法

1、jsp页面，携带值跳转到新页 original.jsp var btnClick = {'click .shownewPage':function (e, value, row, index) {//点击按钮时触发时间 var Id = row.Id; layer...

2020-05-27

60浏览

0评论

layer.confirm()右边按钮实现href的例子

layer官方API默认右边按钮=右上角X按钮，点击=关闭弹窗此方法最终效果是右上角X保留关闭弹窗功能，并且右边按钮能设置（location.href=""）等之前试过的写法（错误）：layer.confirm('想...

2020-05-27

89浏览

0评论

使用layui监听器监听select下拉框,事件绑定不成功的解决方法

如下所示：使用layui监听select所选的value需要注意的是：form.on必须写在layui.use(){}中且使用layui动态添加option时，必须要进行渲染（form.render()），否则选项追加不上这样做完之...

2020-05-27

112浏览

0评论

解决layui下拉框监听问题(监听不到值的变化)

关于layui监听下拉框值得变化，大家都知道官方文档给我们提供了一个方法form.on('select(demo)',function(data){ console.log(data.value)//打印当前select选中的值})按照我...

2020-05-27

71浏览

0评论

layui下拉列表select实现可输入查找的方法

如下图，这是一个layui的下拉列表select，随着下拉数据越来越多，我们找某个选项就比较吃力了。这是原下拉列表的代码（数据是从后台传来的）：为了解决这个问题，我们可以将select改为可...

2020-05-27

77浏览

0评论

layui的数据表格+springmvc实现搜索功能的例子

如下所示：主要在前端页面加：<div class="demoTable"> 搜索ID： <div class="layui-inline"> <input class="layui-input" name="keyWord" id="keyWord" autocomplete="off"...

2020-05-27

73浏览

0评论

关于layui的下拉搜索框异步加载数据的解决方法

思路分析：当我使用layui默认的下拉搜索框的时候，layui会默认渲染出一个HTML结构，所以我把渲染出来的这个结果直接给复制出来，这样css的样式就不用从头到尾写一遍了，前端代码（我用...

2020-05-27

104浏览

0评论

layui的select联动实现代码

要实现联动效果注意两点：第一要可以监听到select的change事件；第二异步加载的内容，需要重新渲染后才可以正常使用。html结构：<form class="layui-form batchinput-form" action...

2020-05-27

68浏览

0评论

Layui带搜索的下拉框的使用以及动态数据绑定方法

说起下拉框大家一定不陌生，就是放着指定内容的容器需要什么就直接选择就可以了，很方便。但是凡事都有利弊两面，在数据少的时候是挺方便的但是数据一多起来就选得用户头昏眼花，影...

2020-05-27

80浏览

0评论

Layui选项卡制作历史浏览记录的方法

在很多情况下我们需要使用到历史浏览记录这一个功能，自己制作起来有点麻烦，但是layui的element模块给我们带来了不少的功能，这个模块就是Tab选项卡，例如以下的样式。这里是侧边...

2020-05-27

78浏览

0评论

layui table 表格上添加日期控件的两种方法

方法一：var tableInit = table.render({ elem: '#tbtxrz' , method: 'post' , data: jsonData , height: "auto" , id: "tbtxrz"...

2020-05-27

69浏览

0评论

layui时间控件选择时间范围的实现方法

解决layui时间控件清空之后无法正常使用的问题，以及时间范围的选择共有两种解决方式：方式一(layui 1.x)：html代码：<div class="layui-inline"> <div class="layui-input-inline...

2020-05-27

84浏览

0评论

laydate只显示时分不显示秒的功能实现方法

场景最近有个需求，需要选择时间段，例如10:00 ~ 12:30。目前的系统前端用的是layui，时间插件自然是选择了laydate。查阅了laydate的api发现并没有直接可以设置去掉秒并且分钟只...

2020-05-27

113浏览

0评论

JavaScript生成随机验证码代码实例

利用canvas制作一个随机验证码：　　1、clearRect：context.clearRect(x,y,width,height);清空给定矩形内的指定像素　　2、fillStyle：设置画笔的颜色　　3、rotate(deg)：旋转角度...

2020-05-27

133浏览

0评论

解决layui laydate 时间控件一闪而过的问题

问题：一个页面多次重载时间控件，并且都是不同页面，会导致时间控件绑定了，又被覆盖其他id的时间控件，又重新绑定上去。就会导致点击日期框，弹框一闪而过，从其他弹窗切换回来，又有了...

2020-05-27

131浏览

0评论

javascript头像上传代码实例

上传头像：相关关键词：ondragover（拖动元素在投放区内移动）ondrop （元素放在投放区触发但是要去处理浏览器默认事件的影响：ondragenter、ondragover）dataTransfer（它可以保存一项或多...

2020-05-27

86浏览

0评论

json字符串对象转换代码实例

这篇文章主要介绍了json字符串对象转换代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下1、将字符串转为json对...

2020-05-27

92浏览

0评论

JavaScript实现轮播图效果代码实例

这篇文章主要介绍了JavaScript实现轮播图效果代码实例,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下HTML部分：<!-- HTM...

2020-05-27

152浏览

0评论

解决layui批量传值到后台操作时出现传值为空的问题

如图，前台的样子，data的参数为[{"good_id":1,"good_name":"标样-总磷","good_num":"BY400014","pid":10,"first_pid":1,"good_standard":"1.46mg/L","good_cas":"7220-81-7"...

2020-05-27

85浏览

0评论

layui table 列宽百分比显示的实现方法

废话不多说了，为大家分享一下layui实现 table 列宽百分比显示的实例代码，希望对大家有所帮助吧var layer = layui.layer, form = layui.form, table = layui.table; var...

2020-05-27

92浏览

0评论

解决layui-table单元格设置为百分比在ie8下不能自适应的问题

1.如果没有采用响应式布局，指定表格的宽度即可解决比如table{ width:1400px !important;}2.如果采用了响应式布局,使用media query查询不同分辨率下的table宽度，然后指定大小...

2020-05-27

115浏览

0评论

解决Layui数据表格的宽高问题

在使用Layui数据表格的时候，如果采用固定数值的话，在不同浏览器里显示会有差异，特别是在不同分辨率设备上。针对以此，把width设置直接去掉，貌似解决了我的显示问题。之前固定宽高...

2020-05-27

82浏览

0评论

JavaScript获取页面元素的常用方法详解

1、通过标签获取元素，返回一个数组　　var li = document.getElementsByTagName('li');//标签获取元素　　li[0].innerHTML;// 查看获取元素的内容　　li[0].innerHTML = "co...

2020-05-27

111浏览

0评论

layui+jquery支持IE8的表格分页方法

工具（框架、插件）1、layui-v1.0.9
2、jquery-1.8.3代码1、jsp代码(可忽略jsp部分，转成html)<%@ page language="java" contentType="text/html; charset=utf-8"%><%@ include f...

2020-05-27

153浏览

0评论

在layui中对table中的数据进行判断(0、1)转换为提示信息的方法

需要把“1”改成中文汉字：在 done方法里面进行数据渲染：layui.use('table', function(){ var table = layui.table ,form = layui.form; tableIns=table.render({ elem:...

2020-05-27

70浏览

0评论

JavaScript实现秒杀时钟倒计时

本文实例为大家分享了JavaScript实现秒杀时钟倒计时的具体代码，供大家参考，具体内容如下功能介绍：1.时/分/秒倒计时直至为零所有代码<!DOCTYPE html><html> <head> <meta chars...

2020-05-27

58浏览

0评论

layui数据表格 table.render 报错的解决方法

一、报错信息Whitelabel Error PageThis application has no explicit mapping for /error, so you are seeing this as a fallback.Wed Jan 23 15:20:18 CST 2019There was...

2020-05-27

96浏览

0评论

react用Redux中央仓库实现一个todolist

本文实例为大家分享了react用Redux中央仓库实现一个todolist的具体代码，供大家参考，具体内容如下Redux简单介绍Redux是一个用来管理管理数据状态和UI状态的JavaScript应用工具...

2020-05-27

70浏览

0评论

解决layui页面按钮点击无反应,也不报错的问题

解决仔细检查代码发现 js 代码中一句代码错误以上这篇解决layui页面按钮点击无反应,也不报错的问题就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持...

2020-05-27

99浏览

0评论

20多个小事例带你重温ES10新特性(小结)

ES10 虽然没有像 ES6 那么多新特性，但 ES10 仍然有一些有用的特性。文本通过简单示例来介绍了 ES10 新出来的特性。通过这种方式，咱们就可以快速理解，而不需要看太多的官方解释...

2020-05-27

62浏览

0评论

layui之数据表格--与后台交互获取数据的方法

jsp或html<table id="userList" lay-filter="userList"></table>js//用户列表var tableIns = table.render({ elem: '#userList', url : 'userAction_findAll.action', cell...

2020-05-27

70浏览

0评论

在Layui中实现开关按钮的效果实例

首先引入js,css<script src="/common/plugins/layui-v2.2.5/layui.js" charset="utf-8"></script><link rel="stylesheet" type="text/css" href="/common/plugins/layui-v2...

2020-05-27

90浏览

0评论

关于layui 实现点击按钮添加一行(方法渲染创建的table)

目标：layui 实现点击按钮添加一行解决方案：方案1、table 是用转换静态表格的方式创建的，写一个button，每次点击按钮，就添加一个<tr> 标签；方案2、table 是用方法渲染的方式创建的，...

2020-05-27

84浏览

0评论

React-redux实现小案例（todolist）的过程

使用React-redux实现，待办事项todolist案例。
注：以下列出主要页面代码，为说明React-redux实现的过程，所以并没有将案例的完整代码展示！一、全局安装：rudux、react-redux
npm inst...

2020-05-27

95浏览

0评论

为nuxt项目写一个面包屑cli工具实现自动生成页面与面包屑配置

公司项目的面包屑导航是使用 element 的面包屑组件，配合一份 json 配置文件来实现的，每次写新页面都需要去写 json 配置，非常麻烦，所以写一个面包屑cli，自动生成页面、自动配置面...

2020-05-27

87浏览

0评论

微信小程序轮播图实现原理及优化详解

轮播图的创建
第一步：在页面创建swiper组件第二步：编写js页面注意事项：wx：for渲染我们js中的图片数组，item默认写法，获取我们的图片数组中的图片，可通过增加wx:for-item="it"来改变...

2020-05-27

热门文章