js
关注
分享
扫一扫
文章平均质量分 70
ztnhnr
这个作者很懒，什么都没留下…
展开
-
html页面使用jQuery和js使用reset()重置表单
因为业务原因，在html页面中动态生成了多个表单。需要动态的通过jQuery或js方法来重置表单元素的值。通过搜索发现，jQuery中是没有reset()方法来实现重置功能的，不过可以通过调用 DOM 中的reset方法来重置表单。一、重置表单的方法1.1 jQuery间接实现：$('#表单ID')[0].reset();1.2 通过DOM方法实现：document.getElementById("表单ID").reset(); ...原创 2021-01-24 13:31:49 · 2075 阅读 · 0 评论 -
JS获取鼠标点击时图片的相对坐标位置并添加自定义内容
因功能需要在图片上点击时，添加自定义的内容。本来想用图片的热区useMap实现，但发现useMap只支持href跳转属性，不能添加自定义的内容。最后通过网上搜索方案，找到如下解决方法。 在点击图片时，通过鼠标点击位置计算点击的坐标，然后在点击的位置添加自定义内容。示例代码如下：<!DOCTYPEhtml><htmllang="en"><head><basetarget="_self"><m...原创 2020-11-30 14:41:09 · 4794 阅读 · 0 评论 -
使用jsonp解决ajax跨域问题
一、 同源策略在前端开发中，所有支持Javascript的浏览器都会使用“同源策略”这个安全策略。同源策略(Same origin policy)，它是由Netscape提出的一个著名的安全策略，它是一种约定，是浏览器最核心也最基本的安全功能。现在所有支持JavaScript 的浏览器都会使用这个策略。所谓同源是指“协议+域名+端口”三者相同。同源策略是为了安全，确保一个应用中的资源只能被本应用的资源访问。而解决这种同源策略的方法称之为跨域，跨域的方法有...原创 2020-11-19 13:35:14 · 207 阅读 · 0 评论 -
js 在一个日期上面加上指定时间(几小时、几分钟、几秒)
在前端开发时，有时我们需要在 javascript 中对日期加上或减去指定的时间。本文简单记录如何对js日期加上或减去指定的时间。一、使用js标准日期对象 当使用js日期对象Date进行时间加减时，这个处理相对比较简单，直接调用Date对象的方法进行操作。只是Date对象最后需要进行格式化（格式化可以参考这篇文章“js 常用日期字符串和日期转换”），这样显示比较友好。示例代码如下：varcurTime=newDate();//curTime:T...原创 2020-11-09 13:32:14 · 30264 阅读 · 1 评论 -
js 常用日期字符串和日期转换
在前端开发时，我们经常需要在 javascript 中对日期进行格式化，将其转换成固定格式的字符串；或者将指定格式的日期字符串，转换为日期进行处理。本文简单记录将日期格式(yyyy-MM-dd hh:mm:ss)和日期对象进行互相转换。一、将日期对象Date转换为格式字符串代码如下：functionformat(date,fmt){varo={"M+":date.getMonth()+1,//月份"d+"...原创 2020-11-06 14:28:34 · 5277 阅读 · 1 评论 -
平面/球面坐标中已知起点坐标、(偏转)角度、长度求终点坐标(三角函数)
最近在做地图开发时，需要根据一个坐标点，计算偏转指定角度和长度后的新坐标。其中用到了三角函数的计算。对应三角函数，忘的已经差不多了，碰到这问题也是花费了一些时间再了解相关知识。本文记录下来，以备后续使用，使用代码为js，其他语言算法相同。计算过程如下图：s为起点坐标，e为需要计算的终点坐标。θ为终点相对起点的偏转角度，d为起点到终点的距离。e的x坐标= s起点的x坐标 + x’； // (x' = d * sinθ)e的y...原创 2020-10-16 14:25:58 · 5973 阅读 · 3 评论 -
javascript变量和函数作用域
在Javascript中，一个变量的作用域（scope）是程序源代码中定义这个变量的区域。一、变量作用域全局变量拥有全局作用域，在Javascript代码中的任何地方都是有定义的。然而，在函数内声明的变量只在函数体内有定义，它们是局部变量，作用域是局部性的。函数参数也是局部变量，它们只在函数体内有定义。在函数体内，局部变量的优先级高于同名的全局变量。如果在函数内声明的一个局部变量或者函数参数中带有的变量和全局变量重名，那么全局变量就被局部变...原创 2020-10-15 13:30:49 · 201 阅读 · 0 评论 -
简介 js 防抖和节流
前端 js 日常开发中，在页面鼠标移动 mousemove，或窗口的 resize、scroll，输入框内容校验等高频操作时，如果事件处理函数调用的频率无限制，会加重浏览器的负担，如果处理不当或放任不管很容易引起浏览器卡死，导致用户体验非常差。此时我们可以采用 debounce（防抖）和 throttle（节流）的方式来减少调用频率，同时又不影响实际效果。一、 函数防抖函数防抖（debounce）：当持续触发事件时，一定时间段内没有再触发事件，事件处理函数才会执行一次；如果...原创 2020-10-14 13:41:36 · 126 阅读 · 0 评论 -
在Cesium中展示热力图heatmap
本文介绍如何在Cesium中展示热力图。目前比较常用的热力图插件是heatmap.js，实现的原理是使用heatmap.js生成热力图后，再将图贴到Cesium的相应位置。准备工作：1. 首先下载heatmap.js插件，官网地址：https://www.patrick-wied.at/static/heatmapjs。2. 然后初始化Cesium，准备展示环境主要步骤：1. 确定热力图画布的宽高2....原创 2020-08-25 13:50:05 · 4950 阅读 · 7 评论 -
Javascript eval()函数
今天在写PHP代码时，需要将服务端返回的对象JSON字符串在页面中转换为对象。刚开始使用的 JSON.parse() 方法，不过中间因为有个属性值中包含“\t”转义空白，导致方法出错。因为返回的字符串长度太大，刚开始怀疑是字符参数长度超出的问题，网络搜索折腾了一圈都没有解决问题。在这个过程中，看到js的 eval 函数也可以计算一个字符串，尝试这个方法后没有报错且返回了对象。虽然最后查到了出错原因，但之前没有太多关注eval函数，本文就此函数的使用简单介绍，以备后续使用。函数定义...原创 2020-08-11 13:53:53 · 372 阅读 · 0 评论 -
Javascript处理JSON方法JSON.parse()和JSON.stringify()
JSON 是用于存储和传输数据的格式，它通常用于服务端向网页传递数据 。而在前端页面js处理中，经常会将字符串和对象进行互相转换，js提供了一个JSON对象来处理这种转换。JSON对象包含两个方法：用于解析 JSON 的 parse() 方法，以及将对象/值转换为 JSON字符串的 stringify() 方法。除了这两个方法, JSON这个对象本身并没有其他作用，也不能被调用或者作为构造函数调用。 本文简单介绍JSON对象两个方法的使用。 1. JSON.parse() ...原创 2020-08-09 14:35:26 · 7452 阅读 · 2 评论 -
Cesium中计算点到另一个点或直线垂足点连线上指定距离的坐标点
接上篇文章“Cesium中点至直线的垂足点和距离计算”，在计算出点到直线的垂足后，就可以将定位坐标点确定到直线。但有一个问题是，由于路线是有一定宽度的，一部分点是落在路线中线上，其他的点是在中线和路线外边线中间的，所以不能简单的把所有的点都计算到路线中线上。同样为了效果真实，最终的想法先计算一个固定的偏移距离，然后分别计算出其他原始坐标点到路线直线的垂足，再根据偏移距离，计算原始坐标点向垂足点偏移此距离后的坐标点。通过上篇文章我们可以计算出参考点到直线的垂足点以及参考点到垂足点的...原创 2020-08-07 13:42:30 · 2998 阅读 · 1 评论 -
Cesium中点至直线的垂足点和距离计算
最近处理GPS定位坐标在Cesium中显示的问题，需要将定位坐标绘制到指定的路线上。但实际的显示结果是，因为定位不准确，最终绘制的GPS坐标基本都是在路线周围乱跳。为了效果好看一点，最终的想法将球面上短距离的路线看作是平面坐标中的直线，将定位坐标通过计算，算出坐标点到直线的垂足点，将垂足点作为最终的定位坐标。整理相关JS方法如下：1. 计算点到直线的垂足点/***点到直线的垂足点*/functiongetFootPoint(point,start,end)...原创 2020-08-06 13:33:47 · 2221 阅读 · 0 评论 -
layui的loading加载层添加自定义文本
前端开发，使用的是layui框架。异步装载数据时，使用layui的loading加载层展示装载效果。而layui默认的loading加载层常用的是切换图标，如下：<script>layui.use(['layer'],function(){layer=layui.layer;//loadinglayer.load(2,{time:2000}...原创 2020-08-05 13:56:54 · 1884 阅读 · 0 评论 -
Javascript生成随机(字符串)颜色值
本文介绍在JS中生成十六进制随机颜色的方法。 1. 使用 Math.random() 生成随机数 Math.random();//结果值(随机):0.92926726819842532. 使用 Number 对象的toString(n) 方法，将数字转换为十六进制字符串Math.random().toString(16);//转换为十六进制(随机):0.ede475ae27ceb3.使用 substr() 截取去除前面的“0”和“.”，并...原创 2020-08-04 13:48:03 · 1182 阅读 · 0 评论 -
CSS中元素的边框border的应用(制作梯形和三角形)
要实现在页面上点击指定元素时，弹出一个信息提示框。因为本人对 CSS 的应用不太熟练，网上搜了一些实现的方式。在使用时，发现提示框的创建用到三角形的生成。本文记录如何使用 CSS 创建梯形和三角形。 实现的原理是设置元素的边框 border 属性创建梯形和三角形。在生成三角形之前，我们可以看下面的2个例子。生成梯形例子： 如果指定一个 div 的宽高相等，再单独设置每个边框的颜色和宽度（边框宽度相等），这时，我们可以发现div的四个方向上都是一个梯形，如下：...原创 2020-08-02 14:06:51 · 1964 阅读 · 0 评论 -
Javascript实现 hashcode 函数实现对象比较
在JavaScript中，数值的比较是比较简单的，使用相等（==）和全等（===）符号基本上可以解决大多数非对象的比较。但是相等（==）和全等（===）符号在对象 object 的比较上，就不能满足所有的要求了，如下面的代码：//定义2个属性值完全相同的实例对象varobj1={name:"neil",age:100};varobj2={name:"neil",age:100};varobj3=obj2;consol...原创 2020-08-01 15:49:05 · 1062 阅读 · 0 评论 -
ECharts饼状图中使用点击事件来跳转到新的页面链接
项目上的一个功能使用了ECharts的统计饼状图表，展示各分组数据所占的比重。然后又提出了新的需求，在点击饼状图的各个部分时，需要跳转到对应的数据列表页面。之前都只是做统计功能，对ECharts的关注点也在统计功能上，还没有处理过相应的点击功能。仔细翻了遍ECharts的api文档，找到了事件处理的相关部分。可以参考“https://echarts.apache.org/zh/api.html#events”。在ECharts 中的事件有两种，一种是鼠标事件，在鼠标点击某个图形...原创 2020-07-30 14:10:38 · 10934 阅读 · 0 评论 -
jquery js处理select元素选择change事件
在html页面中，select元素是我们经常使用的标签元素。本文介绍如何使用原生 js 和 jquery 设置select的默认选中项，以及select的选择事件处理。准备工作：1. 代码：<form><label>城市：</label><selectid="city"name="city"><optionvalue="">请选择</option>...原创 2020-07-21 13:43:14 · 18843 阅读 · 0 评论