![](https://img-blog.csdnimg.cn/20201014180756757.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
JavaScript
土垚金鑫
软件
展开
-
基于jQuery实现首页悬浮框
基于jQuery实现首页悬浮框,如下图所示1,在页面中引入jQuery.bay-window.js,jQuery.bay-window.js的代码如下:!function($){ /** * Description: jquery飘窗插件,可自适应浏览器宽高的变化 * Author: ddqre12345 * CreateTime: 2017.5.3 * param: args={startL:default, startT:default, angle:-Math.PI/原创 2021-07-12 18:59:46 · 1001 阅读 · 3 评论 -
html页面显示pdf渲染成canvas案例以及html显示pdf遇到的跨域问题的解决方案
一,html页面显示pdf渲染成canvas案例如下图所示:1,引入pdf.js<script src="../js/htmlshowPDF/build/pdf.js"></script><script src="../js/htmlshowPDF/build/pdf.worker.js"></script>2,在显示pdf的案列上添加div <div id="the-canvas"></div>3,对应的js代码如原创 2021-07-07 14:56:53 · 2103 阅读 · 0 评论 -
html页面读取pdf案例
html页面读取pdf案列,如下图所示下载pdf.js相关链接如下:pdf.js地址下载下载的项目目录如下:用到的最重要的两个文件夹是build与web两个文件web文件包含的如下:在使用的时候,可以通过iframe标签将viewer.html嵌入到页面,在传入src值的时候,需要添加参数file="pdf的链接路径"<iframe frameborder="0" id="myIframe" scrolling="no" src="../web/viewer.html" width原创 2021-07-02 15:38:01 · 1414 阅读 · 0 评论 -
html2pdf—html页面下载pdf案列,及图片不能显示问题
一,html2pdf—html页面下载pdf文件需求:html2pdf—html页面下载pdf文件使用的插件js是html2pdf.js,html2pdf官方链接地址,按照官方的说明,直接调用save方法就可以。var element = document.getElementById('element-to-print');var opt = { margin: 1, filename: 'myfile.pdf', image: { type: 'j原创 2021-06-28 11:44:32 · 4708 阅读 · 3 评论 -
js 中 for..in 与for..of 的区别
js 中 for…in 与for…of 的区别1,for…in 可以遍历数组,对象①遍历数组时,得到的是索引值②遍历对象时,得到的是对象的key为了方便理解,如下图所示var a1 = [1,2,3];for( item in a1){console.log(item)}var a2 = [{name:'zs',age:16},{name:'ls',age:17}]for( item in a2){console.log(item)}for…in 遍历对象时2,for…of遍历原创 2021-01-27 16:37:21 · 606 阅读 · 0 评论 -
vue项目添加图片裁剪组件
vue项目添加图片裁剪组件功能如下图所示:1,安装命令如下npm i vue-cropper --save2,调用组件,引入vue-cropperimport { VueCropper } from “vue-cropper”;3,封装组件代码如下:cropper.vue<template> <div class="cropper_model"> <el-dialog title="图片剪裁" width="800px原创 2020-12-16 09:46:35 · 2944 阅读 · 1 评论 -
人人开源项目使用jqGrid列表上支持链接与请求方法
使用jqGrid列表上支持链接与请求方法+弹框项目说明:由于在开发过程中,项目使用的是开源项目 人人项目(地址为https://www.renren.io/community/project),但由于前端人手不够,只能在此版本基础上修改。1,在列表上添加链接:在colModel 数组中找到对应的列{ label: '双选会标题', name: 'title', index: 'title1', width: 80 ,sortable:false,formatter:function (cellva原创 2020-12-02 15:18:42 · 274 阅读 · 1 评论 -
js中省代码
var provinceList = [{provinceCode: “110000”, provinceName: “北京”},{provinceCode: “120000”, provinceName: “天津”},{provinceCode: “130000”, provinceName: “河北省”},{provinceCode: “140000”, provinceName: “山西省”},{provinceCode: “150000”, provinceName: “内蒙古自治区”},原创 2020-12-02 09:43:08 · 1125 阅读 · 0 评论 -
js文本内容显示6行,超出6行出现显示更多按钮,css样式超出行数只能使用...去替代
js处理文本内容显示6行,超出6行出现显示更多按钮,对于网上说的css样式处理,基本上都是超出6行使用…去处理,不符合需求,先看结果,再看需求:如下先看实现结果,如下图所示:需求:产品经理提出详情信息中默认只展示6行,超出6行后,显示“展示更多”按钮。分析:小编接到这个需求也是一脸懵,经过几天的闲时思考,终于实现!对于网上说的css样式处理,基本上都是超出6行使用…去处理,不符合需求,所以还得分析,如下1,宽度不定(移动端),高度不定,文本内容不定(文字可以是汉子,字母,数字等),几乎什么都不确原创 2020-06-20 00:14:55 · 4827 阅读 · 1 评论 -
es6的原型和原型链
es6的原型和原型链的关系图如下所示。①每个函数都有一个prototype属性,这个属性会指向一个对象,就是通过调用该构造函数而创建的实例原型,可以通过实例对象的__proto__来访问到这个原型对象。②实例在创建时,就会默认关联原型,并且会从原型继承属性。③而每一个原型对象有都会存在一个constructor属性,这个属性会指向关联的这个构造函数。④当访问一个实例对象的属性时,如果说这个...原创 2020-03-23 14:15:11 · 1400 阅读 · 0 评论 -
js--数据类型是nodeList 转成数组Array类型
问题:获取div下的子元素获取div为 class=‘mainContent’下的所有子标签使用 Array.prototype.slice.call(NodeList); let contentMain = document.querySelector('.mainContent'); let nodes =contentMain.childNodes; //nodeList类型 l...原创 2020-01-21 16:36:03 · 887 阅读 · 0 评论 -
vue项目开发首页模板,支持scroll鼠标滑动,菜单按钮选项会浮动
案例:如下图所所示,项目首页类似如下图所示的结构,菜单模块(模块A,模块B,模块C),点击 “模块A”的时候,在浏览器上会滚动到A模块的内容上,点击“模块B”会滚动到“模块B”的模块上,模块C 同上。当浏览器鼠标下滑时,菜单模块会进行浮动。注意事项:本案例需重构 html与body的height,如下代码html,body{ height: 100%;}1,菜单模块在浏览是悬浮...原创 2020-01-21 14:28:24 · 678 阅读 · 0 评论 -
div上添加scroll监听事件失败的原因
1,问题:在给div添加scroll监听事件时,发现添加失败,即在添加的方法中没有执行要添加方法,如下document.querySelector('.appMain').addEventListener('scroll',this.handleScroll,true)2,发现问题在寻找问题的过程中,使用window添加 scroll 监听事件时可以的,但是在div上添加scroll监听事...原创 2020-01-21 12:05:13 · 6360 阅读 · 1 评论 -
vue项目el-table使用slot解决表头是可变的列
vue项目el-table使用slot解决表头是可变的列需求:列表中表头是不固定的,可以说是个可变的列,所以使用了slot标签和循环遍历可变的数组。案例和代码如下所示。代码如下:<template> <div> <el-table ref="tab" stripe ...原创 2020-01-19 16:08:30 · 6285 阅读 · 0 评论 -
vue项目中添加lodash
Lodash是一个一致性、模块化、高性能的 JavaScript 实用工具库。官方网址为:https://www.lodashjs.com/1,安装Lodash,通过npm安装,如下: npm i -g npm npm i --save lodash浏览器环境中,引入如下:<script src="lodash.js"></script>2,引入load...原创 2020-01-19 10:13:24 · 1348 阅读 · 0 评论 -
onscroll事件没有响应的问题
案列:在项目中给页面dom元素添加scroll事件,即鼠标上下滚动时发现没有响应,排查问题如下我遇到的问题如下:①没有添加over-flow:auto②在绑定的元素上 document.querySelect(’.bindDiv’).addEventListener(‘scroll’,this.myScroll) ,添加监听事件后,在myScroll方法中没有起作用③在window上添加w...原创 2020-01-16 19:59:32 · 1833 阅读 · 0 评论 -
js中使用if(val)判断中,val值会被认为是false的情况
js中使用if(val)判断中,val值会被认为是false的情况,如下图所示① if(undefined)② if(0)③ if(null)④ if("") //空字符串⑤ if(NaN)⑥ if(false) 本身即是Boolean代码如下所示,浏览器运行结果如上图所示。<!DOCTYPE html><html lang="en"><hea...原创 2020-01-08 14:49:29 · 1746 阅读 · 0 评论