jquery 自整理
echarts官方:Documentation - Apache ECharts
1、CheckBox复选框
//选中事件(页面点击)
$('#operateExit').on('ifChecked', function(){
$('input[name="operateExit"]').val('1');
});
//非选中事件(页面点击)
$('#operateExit').on('ifUnchecked', function(){
$('input[name="operateExit"]').val('0');
});
//知道CheckBox值让其选中或非选中(如:初始化页面时)
if($('input[name="operateImport"]').val()=='1'){
$('#operateImport').iCheck('check'); //选中
}else{
$('#operateImport').iCheck('uncheck'); //非选中
}
2、radio单选
//动态获取的值进行动态选中
$("input[name='carType'][value="+data.car.carType+"]").iCheck('check'); //data.car.carType要选中的值
//页面选中的值动态将其取消(选中改为非选中)
var carType = $("input[name='carType']:checked").val(); //获取到选中的值
$("input[name='carType'][value="+carType+"]").iCheck('uncheck'); //将其改为非选中
3、动态给select下拉框赋值
后台controller查询:
@ResponseBody
@RequestMapping({"checkInfo"})
public Map<String, Object> checkDriver(String belongsType){
Map map = new HashMap();
try {
SysUser user = UserUtils.getSysUser();
LogDriversExample driversExam = new LogDriversExample();
LogDriversExample.Criteria driversCri = driversExam.createCriteria();
driversCri.andCompanyIdEqualTo(user.getCompanyId());
driversCri.andEnabledEqualTo(Integer.valueOf(1));
if ("1".equals(belongsType))
driversCri.andDriverTypeEqualTo("0");
else {
driversCri.andDriverTypeEqualTo("1");
}
List drivers = this.logDriversService.selectByExample(driversExam);
LogCarManagementExample carExam = new LogCarManagementExample();
LogCarManagementExample.Criteria carCri = carExam.createCriteria();
if ("1".equals(belongsType))
carCri.andTypeEqualTo("1");
else {
carCri.andTypeEqualTo("2");
}
carCri.andCompanyIdEqualTo(user.getCompanyId());
List car = this.carManagementService.selectByExample(carExam);
map.put("drivers", drivers); //司机
map.put("car", car); //车辆
} catch (Exception e) {
e.printStackTrace();
this.logger.error("调度单查询所属类型出错:" + e.getMessage());
}
return map;
}
jQuery赋值:
$("#belongsType").change(function() {
if ($("#belongsType").val() != '') {
$.post(ctx+"/log/sendOrder/checkInfo", {
"belongsType" : $("#belongsType").val()
}, function(data) {
$("#driverMobile").val("");
$("#driverName").html("");
$("#carInfo").html("");
jQuery("#driverName").append("<option value=''></option>");
jQuery("#carInfo").append("<option value=''></option>");
$.each(data.drivers, function (i, item) {
jQuery("#driverName").append("<option value="+ item.id+"-"+item.name+">"+ item.name+"</option>"); //司机
});
$.each(data.car, function (i, item) {
jQuery("#carInfo").append("<option value="+ item.carNumber+">"+ item.carNumber+"</option>"); //车辆
});
}, "json");
}else{
$("#driverMobile").val("");
$("#carInfo").val("");
}
});
jsp页面效果:
<!-- 司机 -->
<select id="driverName" name="driverName" class="select">
<option></option>
<option value="13-李师傅" selected="selected">李师傅</option>
</select>
<!-- 车辆 -->
<select id="carInfo" name="carInfo" class="select">
<option></option>
<option value="陕A888888" selected="selected">陕A888888</option>
</select>
jQuery:
//所属类型
$("#belongsType").change(function() {
if ($("#belongsType").val() != '') {
$.post(ctx+"/log/sendOrder/checkInfo", {
"belongsType" : $("#belongsType").val()
}, function(data) {
$("#driverName").html("");
$("#carInfo").html("");
jQuery("#driverName").append("<option value="+ +">"+ +"</option>");
jQuery("#carInfo").append("<option value="+ +">"+ +"</option>");
$.each(data.drivers, function (i, item) {
jQuery("#driverName").append("<option value="+ item.id+"-"+item.name+">"+ item.name+"</option>");
});
$.each(data.car, function (i, item) {
jQuery("#carInfo").append("<option value="+ item.carNumber+">"+ item.carNumber+"</option>");
});
}, "json");
}else{
$("#driverMobile").val("");
$("#carInfo").val("");
}
});
controller:
LogCarManagementExample carExam = new LogCarManagementExample();
com.tp.log.model.LogCarManagementExample.Criteria carCri = carExam.createCriteria();
if("1".equals(belongsType)){
carCri.andTypeEqualTo("1");
}else{
carCri.andTypeEqualTo("2");
}
carCri.andCompanyIdEqualTo(user.getCompanyId());
List<LogCarManagement> car = carManagementService.selectByExample(carExam);
map.put("car", car);
//rangeSlider
官方网站:http://ionden.com/a/plugins/ion.rangeSlider/index.html
试用网站:http://jsrun.net/4NYKp/edit
js/css下载:https://www.bootcdn.cn/ion-rangeslider/
<%--引用ion.rangeslider--%>
<link rel="stylesheet" href="/rangeslider/css/ion.rangeSlider.css" />
<script type="text/javascript" src="/rangeslider/js/ion.rangeSlider.js"></script>
//页面div
<div style="width: 45%; margin-top: 10px; margin-left: 10px; float: left;">
<div id="jdRange"></div>
</div>
//初始化rangeSlider
var timer = null;
var sliderFrom = 1;
var valueArray = new Array();
valueArray.push("123");
valueArray.push("456");
$(function() {
$("#jdRange").ionRangeSlider({
min: 0,
max: 100,
from: 1,
to: 5,
step: 1,
values: valueArray,
onFinish: function(data){
console.log(data.from);
sliderFrom = data.from;
}
});
timer = setTimeout("bf()", 1000);//1s调用一次
});
function bf() {
$("#jdRange").data("ionRangeSlider").update({//更新rangeSlider
from: sliderFrom,
to: sliderFrom+1
});
clearInterval(timer);//清除定时任务
}
分录图片展示
js:
//初始化异常节点图片
function init_optEntry(){
$('.tbody tr').each(function(){
var tbody_tr=$(this);
var id=$(this).find("input").val();
if(id != null){
$.ajax({
url : ctx+'/ft/transOrder/selectImage',
data:{id:id},
type : 'post',
async: false,//使用同步的方式,true为异步方式
success : function(data){
if(data != null && data != ""){
var ImageList=data.ImageList;
$.each(ImageList, function(index,item){
tbody_tr.find('.Image').append('<a href="javascript:;" οnmοuseοver="imagePreview(this);"><img style="width:20px;height:26px;" src='+item.url+'></a> ');
});
}
}
});
}
});
}
//图片放大显示
function imagePreview(obj){
xOffset = 100;
yOffset = -230;
$(obj).hover(function(e){
var imgPath = $(obj).find('img').attr("src") ;
var img_html = "<div id='preview'><img style='position:absolute;width:400px;height:500px;z-index:99;' src='"+ imgPath +"' /></div>" //position:absolute;z-index:99;让图片悬浮在页面之上
$("body").append(img_html);
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px")
.fadeIn("slow");
},
function(){
$("#preview").fadeOut("fast");
$("body").find("#preview").remove();
});
$(obj).mousemove(function(e){
$("#preview")
.css("top",(e.pageY - xOffset) + "px")
.css("left",(e.pageX + yOffset) + "px");
});
}
jsp:
<style type="text/css">
#preview{
border:1px solid #ddd;
/* background:#f9f9f9; */
color:#666;
/* padding:12px 15px; */
/* width: 320px; */
/* height: 145px; */
display:none;
position:absolute;
}
</style>
<td>
<c:if test="${not empty map.ZCJD009}">
<input value="${map.ZCJD009.id}" type="hidden"/>
<div class="pos-r Image">
</div>
</c:if>
</td>
相关文章:
jquery 自整理
echarts官方:Documentation - Apache ECharts 1、CheckBox复选框 //选中事件(页面点击) $(#operateExit).on(ifChecked, function(){ $(input[name"operateExit"]).val(1); }); //非选中事件ÿ…...
MySQL | 加索引报错
报错信息 1170 - BLOB/TEXT column user_name used in key specification without a key length解决方案 分析 这个错误通常是因为尝试在一个包含BLOB或TEXT类型列的列上创建索引时没有指定键的长度。MySQL要求在使用BLOB或TEXT类型列作为索引键时,必须指定键的长…...
前端:自制年历
详细思路可以看我的另一篇文章《前端:自制月历》,基本思路一致,只是元素布局略有差异 ①获取起始位startnew Date(moment().format(yyyy-01-01)).getDay() ②获取总的格子数numMath.ceil(365/7)*7,这里用365或者366计算结果都是一样的371 …...
9.手写JavaScript大数相加问题
一、核心思想 找到两个字符串中最长的长度,对两个字符串在头位置补0达到相等的长度,相加时注意进位和类型转换,特别考虑当相加到第一位是如果仍然有进位不要忽略。此外,js中允许使用的最大的数字为 console.log("最大数&qu…...
FPGA开源项目分享——基于 DE1-SOC 的 String Art 实现
导语 今天继续康奈尔大学FPGA课程ECE 5760的典型案例分享——基于DE1-SOC的String Art实现。 (更多其他案例请参考网站: Final Projects ECE 5760) 1. 项目概述 项目网址 ECE 5760 Final Project 项目说明 String Art起源于19世纪的数学…...
通过 CLI 和引入的方式使用 React:基础入门
使用React 有两种使用方式,主要有以下几个原因: 灵活性和适应性: 引入的方式可以让开发者在现有的 HTML 页面中快速引入 React,无需设置完整的项目环境。这适合小型或原型项目。 CLI 方式则更适合用于构建大型复杂的 React 应用程序,因为它提供了更完整的项目结构和…...
第三资本:铸就辉煌非凡的资历
第三资本香港有限公司在在金融投资领域一直以专业精神和不懈追求获得良好名声,近几年在国际资本市场上更是写下了辉煌的章节。针对第三资本而言,专业是基本,也是成功的唯一途径。投资总监刘国海解释道:“金融从业者务必深入把握专业能力,对行业现状敏感,重视风险管控,才能在这个…...
基于激光雷达的袋装水泥智能装车系统有哪些优势?
激光雷达技术在水泥机械智能化中发挥着举足轻重的作用,特别在袋装水泥智能装车系统的应用中表现得尤为突出。 由因泰立科技精心打造的基于激光雷达的袋装水泥智能装车系统,不仅大幅缩短了装车码垛的时间,降低了工人的劳动强度,还显…...
实战自动化修改主机名
一、主程序 #!/bin/bash# 设置主机名为node01 set_hostname() {local new_hostname$1echo "正在设置主机名为 $new_hostname ..."# 使用hostnamectl设置主机名hostnamectl set-hostname $new_hostname# 检查主机名是否更改成功if [ "$(hostname)" "…...
无人机GB42590接收端 +接收端,同时支持2.4G与5.8G双频WIFI模组
严格按照GB42590的协议开发的发射端,通过串口和模块通讯,默认波特率 921600。 http://www.doit.am/首页-深圳四博智联科技有限公司-淘宝网https://shop144145132.taobao.com/?spma230r.7195193.1997079397.2.71f6771dJHT2r0 二、接口文档 单片机和模…...
PVE系统的安装
一.PVE系统的安装 前置准备环境:windows电脑已安装Oracle VM VirtualBox,电脑支持虚拟化,且已经开启,按住ctrl+shift+ESC打开任务管理器查看是否开启,如果被禁用,可进入BIOS开启虚拟化,重启电脑后再进行后续操作。本步骤选用windows10安装VirtualBox,版本为7.0.8。 …...
一辆汽车的节拍时间是怎样的?
节拍时间,又称 takt time,是德语中“节奏”的意思。在汽车制造业中,它指的是按照客户需求和生产计划,生产一辆汽车所需的时间。这个时间是固定的,它决定了生产线上每个工序的操作速度和节奏,是生产线上所有…...
数据结构-合并两个有效数组
题目描述 给你两个按 非递减顺序 排列的整数数组 nums1 和 nums2,另有两个整数 m 和 n ,分别表示 nums1 和 nums2 中的元素数目。 请你 合并 nums2 到 nums1 中,使合并后的数组同样按 非递减顺序 排列。 注意:最终,…...
华为2024年校招实习硬件-结构工程师机试题(四套)
华为2024年校招&实习硬件-结构工程师机试题(四套) (共四套)获取(WX: didadidadidida313,加我备注:CSDN 华为硬件结构题目,谢绝白嫖哈) 结构设计工程师,结…...
使用Pandas解决问题:对比两列数据取最大值的五种方法
目录 一、使用max方法 二、使用apply方法结合lambda函数 三、使用np.maximum函数 四、使用clip方法 五、使用where方法结合条件赋值 总结: 在数据处理和分析中,经常需要比较两个或多个列的值,并取其中的最大值。Pandas库作为Python…...
rk3588 安卓13 应用安装黑名单的接口
文章目录 概述一、app应用安装黑名单核心代码二、app应用安装黑名单核心功能分析三、代码实战1.先导入所需要的包2.添加获取黑名单方法3.添加限制黑名单方法4.上层使用PS:查看当前黑名单 总结 概述 在13.0系统rom定制化开发中,客户需求要实现应用安装黑名单功能&am…...
Grafana数据库为MySQL
一、Grafana是一款流行的开源监控和数据可视化平台,它默认使用SQLite作为数据库引擎。然而,对于大型项目或者需要更高性能的场景,我们通常会选择使用MySQL作为Grafana的数据库。在本文中,我将向你介绍如何将Grafana的数据库从SQLi…...
【计算机考研】数据结构都不会,没有思路,怎么办?
基础阶段,并不需要过于专门地练习算法。重点应该放在对各种数据结构原理的深入理解上,也可以说先学会做选择题、应用题。 因为在考试中,大部分的算法题目,尤其是大题,往往可以通过简单的暴力解决方案得到较高的分数。…...
word文档显示异常,mac安装word字体:仿宋gb2312
因为mac没有gb2312字体,windows上word里显示的gb2312字体与排版,在mac上显示为黑体、排版也错乱了,得不到想要打印格式。 需要安装gb2312字体 下载:仿宋GB2312.zip 解压后双击安装得到:仿宋GB2312.ttf 放入word&…...
【运维】Ubuntu 配置DNS服务器
背景 异常表现 部分域名无法解析,表现为 ping ***.com 提示 ping: ***.com: No address associated with hostname尝试解决方案 采用 sudo vim /etc/resolv.conf编辑的形式,指定DNS解析服务器 原始内容如下: nameserver 127.0.0.53 opti…...
docker详细操作--未完待续
docker介绍 docker官网: Docker:加速容器应用程序开发 harbor官网:Harbor - Harbor 中文 使用docker加速器: Docker镜像极速下载服务 - 毫秒镜像 是什么 Docker 是一种开源的容器化平台,用于将应用程序及其依赖项(如库、运行时环…...
如何在看板中体现优先级变化
在看板中有效体现优先级变化的关键措施包括:采用颜色或标签标识优先级、设置任务排序规则、使用独立的优先级列或泳道、结合自动化规则同步优先级变化、建立定期的优先级审查流程。其中,设置任务排序规则尤其重要,因为它让看板视觉上直观地体…...
【论文笔记】若干矿井粉尘检测算法概述
总的来说,传统机器学习、传统机器学习与深度学习的结合、LSTM等算法所需要的数据集来源于矿井传感器测量的粉尘浓度,通过建立回归模型来预测未来矿井的粉尘浓度。传统机器学习算法性能易受数据中极端值的影响。YOLO等计算机视觉算法所需要的数据集来源于…...
Robots.txt 文件
什么是robots.txt? robots.txt 是一个位于网站根目录下的文本文件(如:https://example.com/robots.txt),它用于指导网络爬虫(如搜索引擎的蜘蛛程序)如何抓取该网站的内容。这个文件遵循 Robots…...
Unit 1 深度强化学习简介
Deep RL Course ——Unit 1 Introduction 从理论和实践层面深入学习深度强化学习。学会使用知名的深度强化学习库,例如 Stable Baselines3、RL Baselines3 Zoo、Sample Factory 和 CleanRL。在独特的环境中训练智能体,比如 SnowballFight、Huggy the Do…...
实现弹窗随键盘上移居中
实现弹窗随键盘上移的核心思路 在Android中,可以通过监听键盘的显示和隐藏事件,动态调整弹窗的位置。关键点在于获取键盘高度,并计算剩余屏幕空间以重新定位弹窗。 // 在Activity或Fragment中设置键盘监听 val rootView findViewById<V…...
Unsafe Fileupload篇补充-木马的详细教程与木马分享(中国蚁剑方式)
在之前的皮卡丘靶场第九期Unsafe Fileupload篇中我们学习了木马的原理并且学了一个简单的木马文件 本期内容是为了更好的为大家解释木马(服务器方面的)的原理,连接,以及各种木马及连接工具的分享 文件木马:https://w…...
python报错No module named ‘tensorflow.keras‘
是由于不同版本的tensorflow下的keras所在的路径不同,结合所安装的tensorflow的目录结构修改from语句即可。 原语句: from tensorflow.keras.layers import Conv1D, MaxPooling1D, LSTM, Dense 修改后: from tensorflow.python.keras.lay…...
深度学习之模型压缩三驾马车:模型剪枝、模型量化、知识蒸馏
一、引言 在深度学习中,我们训练出的神经网络往往非常庞大(比如像 ResNet、YOLOv8、Vision Transformer),虽然精度很高,但“太重”了,运行起来很慢,占用内存大,不适合部署到手机、摄…...
五子棋测试用例
一.项目背景 1.1 项目简介 传统棋类文化的推广 五子棋是一种古老的棋类游戏,有着深厚的文化底蕴。通过将五子棋制作成网页游戏,可以让更多的人了解和接触到这一传统棋类文化。无论是国内还是国外的玩家,都可以通过网页五子棋感受到东方棋类…...
