JavaScript
关注
分享
扫一扫
左直拳
程序猿
展开
-
extjs向后台请求数据先跳转（xhr/302）然后报CORS跨域错误问题
二者结合，就是报错情况中，为啥先跳转？302就是跳转，后面就是跳到登录页面。由于登录页面位于另一个单点登录，所以会报跨域问题。因此，本错误重点不是跨域，而是为啥会出现跳转。据分析，跳转是因为超时。请求数据过程中超时了，导致登录状态失效，因而出现跳转，跳到登录页。如图所示，这三个提示是连在一起的。所以，对于本错误，应把努力方向放在排查为何请求数据会超时上。这种错误，其实很容易被跨域这个字眼所误导。原创 2023-04-25 18:25:32 · 648 阅读 · 2 评论 -
echart使用同一色系，深浅随机的颜色
图中的虚线，都是红色，深浅不同，代表一种观测数据。原理是将指定颜色的R、G、B分别加上同一个随机数，该随机数在 -255 与 255之间。使用echart画统计图，有时想将不同线条的颜色都用同一种色系，然后深浅不同做区分。原创 2023-02-17 18:27:17 · 454 阅读 · 0 评论 -
echarts使用备忘录
里面还有个属性，没有展示，就是gird。grid就是统计图的中间的图形部分，不包括标题、图例等，如上图蓝框所示。整个echart的大小，其实就是承载echart的div的大小。问题是，它属性很多，不同图形，不同颜色，不同形状，都通过属性设置，灵活是灵活，但属性太多了，而且不容易搞清楚，哪个地方对应什么属性。想稍微改动一下，给人感觉，就是狗咬乌龟，无处下牙。不过，echart算是给出了一个说明书，统计图中，哪个位置对应哪个大的属性，将鼠标悬停在该位置，系统会显示出对应的属性名称。原创 2023-01-10 11:57:19 · 189 阅读 · 0 评论 -
js中独立的与运算（&&）表达式
题目可能描述不够规范，就是这么个意思吧。精简和可读性有时需要权衡。原创 2022-12-05 11:58:41 · 439 阅读 · 0 评论 -
dojo中的类
使用arcgis api for js 4.*进行地图的web前端开发，就不得不与dojo打交道。dojo是一个框架，自成体系，比如它对类的支持，有自己的一套，有些地方甚至十分奇特。因为前端要用到arcgis api for js，依赖dojo，了解即可，不作深究。原创 2022-12-04 14:19:40 · 442 阅读 · 0 评论 -
js文件模块化引用问题（JavaScript modules）
有个前端项目，需要用到配置文件。这个配置文件实在是太大了，就想拆成多个小的，然后一一引入，组合成一个完整的配置文件。如果是vue代码，这种情况根本是手到擒来，不费吹灰之力，而该前端项目是个普通的js程序。但其实，在编写VUE代码过程中，我们所熟知的import，export，并不是VUE的语法，而是js es6（？）的语法。所以，虽然不是VUE项目，现在一般的浏览器都能支持js代码中使用import和export。思路是这样的：1）将配置文件拆成一个主配置文件，以及多个小的js文件。原创 2022-11-22 16:54:02 · 4073 阅读 · 1 评论 -
pdfview查看阿里云存储对象跨域问题
应该设置阿里云。有一项目利用阿里云来存储上传的附件。其中有pdf等文件类型。利用pdfview在线查看pdf，结果提示跨域。按照网上教程，修修改改，问题始终存在。后来到阿里云上看，发现有个跨域设置，设置相关信息，问题解决。...原创 2022-02-22 16:19:19 · 1059 阅读 · 0 评论 -
使用vue.js + jQuery开发组件
本模式有3个要点：1）利用vue.js实现html封装进组件，让复用可以落地；2）jquery负责操作dom；3）js函数模拟面向对象中的类，运行时通过new方式创建对象，将dom标识符和业务数据作为参数传递，提高组件独立性，实现与调用页面解耦，且能够动态渲染。近期做的一个项目，使用的框架十分古怪。spring boot，但没有使用默认的thymeleaf，而是前后端分离，同时前后端代码却又放在同一个项目工程里。前端使用了vue.js，但与我之前接触到的vue项目很不一样。一般vue项目，除了一个首原创 2022-01-22 15:41:30 · 2260 阅读 · 0 评论 -
js异步赋值
var sheep = 0;//可供外部访问getObj(sheep).then((goat) => { sheep = goat alert(sheep);//显示为1 //发射一个消息 window.postMessage({ cmd: 'sheepIsReady', params: { success: true, data: true } }, '*');});function getO原创 2021-11-26 19:25:31 · 1253 阅读 · 0 评论 -
vue 里面 export/import js文件
vue要导入js文件的话，有一定的讲究，js文件本身也需要遵循一定的格式。vue最大的特征，我看就是组件化开发。其中，export 各种vue组件已经是必要操作，不要太多。那么， js文件呢？以前，采用原生js或者jquery时代，引用外置js文件也是惯例。一、想要import，必先export首先，vue是可以导入js文件的，这也是组件化开发的一部分。不过，ue要导入js文件的话，有一定的讲究，js文件本身也需要遵循一定的格式。在vue中，一个js要想可以被import的话，它一定要export一些原创 2021-07-24 12:22:33 · 10916 阅读 · 0 评论 -
react获取并设置虚拟DOM
react，这就开始了。react的一个特点，就是所谓虚拟dom。虚拟者，就是只存在于逻辑运算中，物理并不存在。因此，想获取或者设置dom，用以前的document.getElementById()之类的方法是不行的。应该用ref。有代码有真相/** * 跳到网站前端 */ import React, { Component } from 'react'; import ReactDOM from 'react-dom'; import styles from './index.less';原创 2021-03-19 14:25:13 · 810 阅读 · 2 评论 -
gulp初体验
前段时间我们搞了个研究和测试性质的cesium项目，基本都是前端的东西。也就是说，主要就是一些js。于是想到用gulp待项目进行发布。据说当今最热门的发布工具室webpack，其次是gulp。但webpack适合SPA，单页应用，而gulp适合传统的多页系统。我们项目非SPA，因此选用gulp。gulp，就是一个项目发布工具，作用我看无非主要就是压缩js\css\html，然后还可以给文件加上版本号。压缩可以起到减少文件尺寸，节约带宽，加快加载，同时有一定保密作用；而加上版本号，则可以使浏览器缓存失效，避原创 2020-09-24 18:54:11 · 486 阅读 · 0 评论 -
js异步对象Promise
此前我对js中的异步机制，只有一点粗浅的认识，只知道有2种机制：1）回调函数2）定时器模拟回调函数好理解，系统自带的，执行完指定函数后，才会执行回调函数。这个概念很容易理解，深入我心。可是，如果没有回调函数怎么办？一般来说，系统都是在事件里面提供回调函数的，但我们写代码的时候，并非全部都是事件。有一个办法就是用定时器进行模拟。在定时触发的事件中，检查我们监控的状态，发现不满足，继续定时触发，指导条件满足才退出。示例：var timer = setInterval(function () {原创 2020-09-15 19:13:02 · 379 阅读 · 0 评论 -
原生js创建并删除dom
一言不合上代码，以canvas为例：id = "canvas1";//创建一个canvasvar canvas = document.createElement("canvas");canvas.id = id; canvas.width = window.screen.availWidth; canvas.height= window.screen.availHeight;canvas.style.cssText = "position: absolute; left: 0px; top:原创 2020-08-07 16:12:47 · 2213 阅读 · 0 评论 -
js面向对象 + 模块化编程
如题所示，又面向对象又模块化，死未？模块化已经总结过，主要解决js之间的依赖问题，方便引用。特别适合动态加载JS的场景。js应用模块化那么面向对象呢？众所周知，js没有类，只有函数。但可以用函数来模拟类和对象。面向对象语言中，类可分为普通类和静态类。普通类要使用的话，要new出一个个对象；静态类则可以直接通过类名来直接使用类里的公共方法。静态类适合类库这种形式。js里面，也可以分普通类和静态类两种方式进行面向对象编程：普通类//普通类//定义function ClassD(p1,p2){原创 2020-07-28 18:04:10 · 544 阅读 · 0 评论 -
Uncaught Error: Mismatched anonymous define() module
想应用js的AMD规范？没这么容易。吭哧吭哧地了解了AMD规范后，兴致勃勃地在页面上添加require.js<!-- AMD规范 --><script data-main="./js/modules" src="./libs/require.js"></script>结果页面就报错了：Uncaught Error: Mismatched anonymous define() module这是冲突了。require.js啥事也没干，就定义了一个define函数原创 2020-07-24 08:54:47 · 11757 阅读 · 2 评论 -
js应用模块化
近来参与的一个GIS项目，类似黑板系统。所有功能都往GIS上展示，因此不可能预先写好全部的JS引用，而采用类似动态注册的方式。我就应用了一回JS的AMD规范。AMD规范最大的好处，我认为是解决了JS依赖的问题。这个JS文件，需要依赖另一个JS文件的内容。如果大家都在一个页面上引用，当然没有问题。但动态取舍的情况就不一样了。利用AMD规范能够较好地解决这个问题。凡符合AMD规范，或者在里面注册的，都可以方便地动态引用。而不必预先声明在页面上。详细步骤和注意事项如下：一、注册符合AMD规范或能应用AMD规原创 2020-07-23 19:45:17 · 1754 阅读 · 0 评论 -
js+css3实现鼠标控制图片旋转实现方向舵效果
一、效果效果如图，这是一个方向舵。用鼠标抓住外面的方向盘旋转，而里面的舵标识保持不动。二、设计思路1、目标由2张图片组成，利用CSS定位属性组合在一起2、监听方向盘图片上的鼠标事件，当鼠标按下并且轨迹改变时，改变方向盘图片对应的CSS的transform属性值，实现其旋转三、代码html<!doctype html><html><head><meta charset="utf-8"><script type="text/jav原创 2020-07-16 09:46:56 · 2839 阅读 · 1 评论 -
cesium初接触：Hello World
潮流用cesium，咱们开始吧。跑到官网上下载源代码，却不知道怎么处理。原来，真的是源代码啊。据说cesium是一个for 3d的js框架，我以为就是一些JS，顶多配置一下，就能挂在web服务器上跑了。但是cesium源代码需要编译。为什么要编译呢？我估计原因是，cesium的源代码并不是标准的JS和CSS写就，比如js用coffescript，css则是scss或者ecss之类，而且写的时候分了模块，然后编译的时候需要转换，以及构建。闲话休提，上步骤：1、编译需要npm，机器没装的话需要装一个，原创 2020-07-06 19:12:09 · 925 阅读 · 0 评论 -
canvas读取跨域图片像素失败 Failed to execute getImageData The canvas has been tainted by cross-origin data
错误描述：Uncaught SecurityError: Failed to execute ‘getImageData’ on ‘CanvasRenderingContext2D’: The canvas has been tainted by cross-origin data.这个canvas的例子，是读取和操作画布上的像素。该画布将一幅照片显示在画布上，然后试图通过鼠标点击照片，读取点中的像素，并显示在一个div上。结果报错，如开头所述。错误描述有关键词，跨域，究其原因，是因为展示的这张照片，原创 2020-06-24 16:49:29 · 11407 阅读 · 1 评论 -
动态加载js
某些场景下需要动态加载js脚本。示例如下<!--/* 地图页面加载气泡相关js 之所以动态加载，是因为气泡相关js不是地图必须依赖，只跟具体业务有关*/--><script th:inline="javascript"> var timer_map2d = setInterval(function () { let doc = document.getElementById("frame2D").contentDocument;原创 2020-05-11 11:31:59 · 457 阅读 · 0 评论 -
js应用函数数组实现依赖注入
听起来高大上，其实技术很简单的，就那么回事。函数数组，就是一个数组咯，元素是函数。遍历这个数组，一个个执行之。依赖注入，就是这个函数数组是个全局变量，模块可以往它里面插入自己的函数。什么场景会用呢？我这里有一个场景，是这样的，容器页里面有好多模块，这些模块各自不同，有各自要处理的东西，但也要有一些方法要放在容器页里统一执行。那么统一执行的这些方法，如果都在容器页里声明，就破坏了模块的封装和...原创 2020-04-19 13:06:57 · 598 阅读 · 0 评论 -
JS的作用域保护
网页中，如果引用了许多JS，那么其中的变量、函数名称就很容易冲突。虽然每个名称加上前缀可以解决这个问题，但未免太烦琐了。应该尽量用函数将它们包裹起来。面向对象三大特性之一是封装，对私有变量和方法进行保护，javascript没有类，只有函数。幸运的是，JS的函数是万能的，可以用来封装。一、构造实例例子：var f = new function(){ let _i = 0; //这里的...原创 2020-01-02 18:51:35 · 437 阅读 · 0 评论 -
在JavaScript中控制链接的点击
在JavaScript中控制链接的点击左直拳 在JavaScript里，可以控制链接的点击，方法就是：objA.click()，这里objA为一个链接对象。示例：做网站的时候，为了好维护和简洁，每个页面都用连接了一个页眉文件：header.html和页脚文件：footer.html。众所周知，在里点击链接，如果该链接的Target不为“_top”或“_parent”或“_b原创 2006-08-30 18:19:00 · 3034 阅读 · 0 评论 -
利用正则表达式检查时间的合法性
利用正则表达式检查时间的合法性左直拳许多时候，少不得要检测一下用户输入的时间格式是否正确。对于B/S结构程序而言，既可以在服务器端检查，也可以在浏览器端检查，将错误封杀于提交之前，免得拿这些小事去烦服务器。我有个WEB应用程序，需要在一个datagrid里面输入时间。决定在提交前检测时间合法性。思路如下：1、 设置一个可使用自定义的javas原创 2006-04-20 16:39:00 · 3677 阅读 · 0 评论 -
Javascript中得到中英文混合字符串的长度
Javascript中得到中英文混合字符串的长度左直拳有同事在公司的OA上发了个贴子，介绍在javascript中如何得到中英文混合字符串的长度。用的是正则表达式。var str = ”坦克是tank的音译”; var len = str.match(/[^ -~]/g) == null ? str.length : str.length + str.match(/[^ -~].........原创 2006-04-28 15:43:00 · 9340 阅读 · 1 评论 -
在js脚本中找到控件
用js脚本找到它左直拳 在脚本里想找到一个控件，有几种方法。如果是FORM里面的控件，如textbox，checkbox，select，等等，可以用document.Form NAME.控件NAME 的形式访问。但很多时候一些控件都不属于FORM，又怎样访问？以前，可以用 document.all.控件ID 的方法，例如，有个确定”/>，用document.all.原创 2006-09-21 22:32:00 · 2616 阅读 · 0 评论 -
Atlas与页面缓存冲突造成报错问题
Atlas会与页面缓存冲突，造成Unkown error问题。Atlas与页面缓存冲突造成报错问题 左直拳近日在网页应用了Atlas，不料部署到服务器后，却频频出错，提示：Unkown error。既然是出错，又不说是什么错误，这不为难人吗？更奇怪的是，并不是所有的时候都出错，基本上是同样的操作，10次会有1到2次没问题。本来在本地开发的时候就出过错，只不过频率很小，因为是系原创 2006-10-26 09:33:00 · 2233 阅读 · 1 评论 -
应用Atlas后，页面输出JS脚本的时机
应用Atlas后，页面输出JS脚本的时机左直拳我写了个用户控件，里面包含了一些JS脚本。在页面调用的时候，默认是隐藏的（Visible=”false”），直到用户触发了某事件，才将此控件弹出来(Visible=”true”)。同时页面上也用了Atlas。那个用户控件被UpdatePanel包围着，这样子它隐藏或显示的时候，页面就不会刷新了，追求一种行云流水，波澜不惊的效果。可是原创 2006-11-01 11:45:00 · 1979 阅读 · 0 评论 -
JS中找到鼠标点击的坐标
JS中找到鼠标点击的坐标左直拳如果想获取页面中鼠标点击的坐标，可以用event.clientX和event.clientY。问题是要注意这个event。它代表当前事件本身。所以，一定要是在事件触发的函数中，才可能访问到这个event，否则为空，event.clientX什么的也就成了镜花水月。例如，有函数GetMouseXY(){ alert(event.cl原创 2006-11-03 15:13:00 · 3626 阅读 · 0 评论 -
JS中获取对象的绝对位置
JS中获取对象的绝对位置左直拳网页中，可以用[object].offsetLeft和[object].offsetTop来获得该对象（object）与其所在容器中的水平及垂直偏移量。问题是，在FF（FireFox）中，它们是返回与BODY的偏移，而在IE中，是其所在容器中的水平及垂直偏移。那么怎样在IE中也能获得与BODY的偏移呢？因为这个偏移才最有用，找到了这两个偏移，就相当于找原创 2006-11-03 15:34:00 · 6995 阅读 · 0 评论 -
在JavaScript中调用WebService
在JavaScript中调用WebService左直拳试着在JavaScript中调用了一下WebService。觉得有两个地方要注意。1、参数传递。一般调用WebService的方法，都要传参数。怎么传？如下：【WebService部分】文件：UserManage/UserInfo.asmx方法：[WebMethod]public string GetUser原创 2006-12-26 17:47:00 · 7857 阅读 · 0 评论 -
页面减肥
页面减肥左直拳 近来给网站的页面瘦身减肥，这里做个总结。1、 尽量少用使用表格定位很方便，也很精确。不过如果不涉及定位，其实没必要滥用表格。一个表格起码要有一对标记，通常还要写上 cellspacing=”0”，cellpadding=”0” style=”width:100%” border=”0” 之类，另外每一行又来一对，再加上单元格的，我的go原创 2007-03-29 16:54:00 · 1746 阅读 · 0 评论 -
用JS脚本做一个可拖动的对话框
用JS脚本做一个可拖动的对话框左直拳一、 可拖动关键是能跟踪鼠标坐标的变化，从而不断修正对话框的坐标。假设待移动的对话框为objMove，则有pX = event.x - objMove.style.pixelLeft;pY = event.y - objMove.style.pixelTop; 其中pixelLeft、pixelTop是对话框左边缘原创 2007-04-02 15:57:00 · 3013 阅读 · 0 评论 -
Javascript函数返回多个值
Javascript函数返回多个值左直拳我从来就没有真正掌握过Javascript，又或许是Javascript不断地在发展，有好多东西看起来常常令我觉得十分惊奇。比如说，在网上看到一条Javascript语句：Return [a,b,c,d];这是返回语句，可是它有对方括号，里面多个值。什么意思？难道是返回多个值？那么，在调用方，又如何提取这些返回值？在网上寻寻原创 2008-04-09 12:44:00 · 14226 阅读 · 10 评论 -
输出JS链接文件再执行
输出JS链接文件再执行左直拳 象 script language="JavaScript" src="outer.js" type="text/javascript">script>这类的句子只能够一早老老实实的写好放在页面里加载执行吗？错。一样可以通过document.write()的形式输出，并且浏览器还是一视同仁的执行，不打任何折扣，IE也好，FF也好，都没有问题。只原创 2008-07-08 18:41:00 · 2026 阅读 · 0 评论 -
Firefox下的坐标
Firefox下的坐标左直拳 FireFox下的坐标与IE有所不同。1、鼠标坐标要获取鼠标的坐标，离不开事件event这个对象。在IE里，event是全局对象，你可以在任何地方引用event，或者用 event.srcElement 来找到触发事件的对象。但是FF不行，必须在触发事件调用的函数里，将event作为参数传过去才能用，如onclick(event)。鼠标当前坐标原创 2008-09-24 16:50:00 · 6128 阅读 · 0 评论 -
网页自动满屏
网页自动满屏 以前可以搞个，然后设它的height=”100%”，这样整个表格就充满了页面，再将内容放在这表格内，搞定。可是不知从什么时候开始，突然发现这个属性失效了。跟头部DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-tr原创 2009-02-12 16:49:00 · 2628 阅读 · 0 评论 -
页面加载，主体先行
Normal 0 7.8 磅 0 2 false false false EN-US ZH-CN X-NONE原创 2009-05-21 15:10:00 · 1528 阅读 · 1 评论 -
动态添加页面的BODY OnLoad事件
if (window.attachEvent) { window.attachEvent("onload", GetMyInfo);//IE}else { window.addEventListener("load", GetMyInfo, false);//FF}function GetMyInfo(){alert("Hello World!");原创 2010-04-21 18:02:00 · 2426 阅读 · 0 评论