jquery 插件 实现图片拖拽效果。拖拽图片出现图片抖动严重问题 5C

在做图片管理时:有一个拖拽功能。图片可以从一个区域拖拽到另一个区域。但拖拽时,图片出现抖动严重问题。不知道什么原因。我使用的是IE11的浏览器,其他浏览器好像没有这种情况 插件:jquery-ui.js。请问路过的朋友,有遇到类似问题。知道解决办法的。告诉小弟一下。感谢图片说明

3个回答

你这个事情是因为宽高度发生改变的时候计算不对造成的。 你自己看下高度是不是一直在变化,代码写的有问题

你拖动的元素css position 设置的什么值?

baidu_36170969
baidu_36170969 absolute
2 年多之前 回复

每次拖动的时候文字都会往上走,我觉得1楼可能说的是正确的

Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
Jquery nestable 插件禁止父子级别间的拖拽,但可以同级别拖拽的方法
Jquery nestable 插件禁止父子级别间的拖拽,但可以同级别拖拽的方法
有没有好用的插件或者怎么实现图片上传,
并且只支持图片(不让它支持多张图片上传),不支持其它文件,可以拖拽上传,也可以点击上传
jqueryUI的draggable拖拽插件进行clone复制拖拽时候,经过其他区域样式发生改变
![图片说明](https://img-ask.csdn.net/upload/201707/05/1499221568_769514.png) ![图片说明](https://img-ask.csdn.net/upload/201707/05/1499221580_234896.png) ![图片说明](https://img-ask.csdn.net/upload/201707/05/1499221589_688626.png) ![图片说明](https://img-ask.csdn.net/upload/201707/05/1499221793_490994.png) 如以上图片,第一张图是将右边列表内容拖拽进中间区域时,样式显示正常 第二三四张图是将左边列表内容拖拽近中间区域时,经过中间区域便会被压缩,最终被挤压成一竖列,这是为什么? 左边列表和右边列表的数据获取方式,样式什么的都是完全相同的,为啥左右的效果不一样
jquery click事件,点击(不松鼠标)并拖动到区域外之后,无法触发click事件,求解决?
smoothness-jquery-ui.js 我是用了这个插件,实现滑块拖拽并且绑定一个数值不断拖拽变化;我用click事件使滑块拖拽松开时,获取最终数值, **但按住滑块拖拽时,鼠标超出了滑块的区域,再松开鼠标按钮就无法获取到根据滑块变化的那个数值了** 试过用mousedown,mouseup都没能解决。
jquery.sortable拖拽合并行的问题
java做的一个拖拽合并行的问题:如图![图片说明](https://img-ask.csdn.net/upload/201611/25/1480050411_304342.png) 我想将9中的1放到10的2的地方,这样9中的数据量就减掉一行,10中增加一行,各位大神们,有谁做过这样的功能,又或者谁有这样的插件或代码呢?急急急
jsp+java裁剪图片鼠标控制div移动放大缩小
最近做了一个头像上传,想做成QQ头像上传那样的,找了各种插件,发现基本上 都是拖动选择区域裁剪图片,并不是我想要的,于是手写了一个纯jquery+java+ajax 的,通过ajax上传到图片并保存到临时文件夹,同时返回图片路径以及宽度高度, 以实现预览效果,鼠标能够拖动图片,能够放大缩小![效果如图](https://img-ask.csdn.net/upload/201708/17/1502959477_513895.png) 但是遗憾的是当图片边框拖动到DIV内部会有留白,这时如果裁剪就会造成选区会超出原图一部分,![如图](https://img-ask.csdn.net/upload/201708/17/1502959824_270867.png) 在此想求一个能够在鼠标拖动和滚轮滚动的时候能够阻止图片边框进入外层DIV的方法,并且不影响下一次拖动和放大缩小,或者有能够在缩放拖动过程中当某一边位置到外层边框的时候将那一边限制其他区域不造成影响
asp.netmvc中ajax提交到后台的问题
![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760240_385611.png) 当我拖动其中一个板块到另一个板块中,释放时就会发生ajax提交到后台 ![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760484_506113.png) ![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760320_335460.png) 数据正常, ![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760348_713877.png) 但当我按了重置的按钮后也会提交一个ajax请求到后台,然后显示出最初始的板块, ajax更新的局部信息写的html代码都是一样的, 重置之后,再拖动板块,然后提交ajax请求,却什么也没有,text.title里没有值了, 可是实际上是有值的 ![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760734_910156.png) ![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760746_715943.png) ![图片说明](https://img-ask.csdn.net/upload/201703/17/1489760758_416712.png) 这是怎么回事,求大神看看,拖拽效果是用jquery ui插件实现的
请问有人知道这种控件是怎么实现的吗?或者在哪里能找到相应的插件?
![图片说明](https://img-ask.csdn.net/upload/201912/31/1577778190_907884.png) 每一个楼栋都有相应的楼层图,每个楼层图都有相对应的房间号,点击闲置可以添加学生,拖拽学生的名字到闲置床位,可以实现床位调整,如果拖拽到有人的床位,可以两人互换.
制作一个考勤表格如何实现鼠标拖动选择多个单元格然后右键菜单实现批量考勤
![图片说明](https://img-ask.csdn.net/upload/201906/19/1560937583_947710.png) 用bootstraptable做了一个考勤的表格。 请问怎么鼠标拖动怎么选取多个单元格弹出菜单然后批量设置呢? html代码 ``` <button class="btn btn-primary" type="button" id="searchBtn_Table" onclick="ifnull()">查询</button> <div class="col-sm-12" id="singlelast"> </div> ``` js ``` function ifnull() { if ($("#TeamGroupName").val() == "0") { zcy.alert.error("请选择需要查询的班组"); return false; } if ($("#date").val() == "") { zcy.alert.error("请选择需要查询的时间"); return false; } //get数据 getAttendanceResult(); //加载表头日期 var date = $("#date").val(); var year = parseInt(date.split("-")[0]); var month = parseInt(date.split("-")[1]); var daycount = getLastDay(year, month); //得到选中月份的最大天数 MaxDays = daycount; selectYear = year; $("#singlelast").empty(); $("#singlelast").append("<table id='tablesinglelast' data-toggle='table' align='center' ></table>") var appendPos = $("#tablesinglelast"); //$("#tablesinglelast").bootstrapTable('destroy'); appendPos.append("<thead><tr>"+ "<th data-field='EmployeeId' rowspan='2' id='employeeName' data-valign='middle' data-align='center'> 工号</th > " + "<th id='lineTd' data-field='EmployeeName' data-valign='middle' rowspan='2' data-align='center'>" + "<span style='float:left;margin-top:20px;'>姓名</span>" + "<span style='float:left;margin-top:-10px;'>日期</span>"+ "</th > " + "<th data-formatter='OvertimeLength' data-valign='middle' colspan='2' data-align='center'>加班</th>" + "<th data-formatter='Askleavelength' data-valign='middle' colspan='2' data-align='center'>请假</th>" + "<th data-valign='middle' data-align='center'>工伤</th>" + "</tr><tr></tr></thead>"); //加载table_foot var table_foot = $("#table_foot"); table_foot.css("display","block"); for (var i = 1; i <= daycount; i++) { var appendPos2 = $("#tablesinglelast").children().eq(0).children().eq(0).children().eq(i+1 - 1); appendPos2.after("<th data-valign='middle' colspan='1' data-align='center'>" + i + "</th>"); } for (var i = 1; i <= daycount; i++) { var appendPos3 = $("#tablesinglelast").children().eq(0).children().eq(1); var month2 = (month > 9) ? ("" + month) : ("0" + month); var day = (i > 9) ? ("" + i) : ("0" + i); var heredate = year + "-" + month2 + "-" + day; var weekday = new Date(heredate).getDay(); text = ""; switch (weekday) { case 0: text = "日"; break; case 1: text = "一"; break; case 2: text = "二"; break; case 3: text = "三"; break; case 4: text = "四"; break; case 5: text = "五"; break; case 6: text = "六"; break; } appendPos3.append("<th data-formatter='DateAttendance' data-align='center' data-field='" + year + "-" + month2 + "-" + day + "'>" + text + "</th>"); selectMonth = month2; } var appendPos3 = $("#tablesinglelast").children().eq(0).children().eq(1); appendPos3.append("<th data-formatter='OverDay' data-align='center'>天</th>"+ "<th data-formatter='OverHour' data-align='center'>时</th>"+ "<th data-formatter='AskleaveDay' data-align='center'>天</th>"+ "<th data-formatter='AskleaveHour' data-align='center'>时</th>"+ "<th data-align='center'>天</th>" ); $('.context').contextmenu({ target: '#context-menu', before: function (e, context) { // execute code before context menu if shown }, onItem: function (context, e) { // execute on menu item selection } }); readyTable(); $("#singlelast tr td").addClass(); } function getLastDay(year, month) { var new_year = year; //取当前的年份 var new_month = month++;//取下一个月的第一天,方便计算(最后一天不固定) if (month > 12) //如果当前大于12月,则年份转到下一年 { new_month -= 12; //月份减 new_year++; //年份增 } var new_date = new Date(new_year, new_month, 1); //取当年当月中的第一天 return (new Date(new_date.getTime() - 1000 * 60 * 60 * 24)).getDate();//获取当月最后一天日期 } function readyTable() { $("#tablesinglelast").bootstrapTable({ //bootstraptable 插件 pageNumber: 1, //初始化加载第一页,默认第一页 pageSize: 10, //每页的记录行数(*) pageList: [10, 20, 30], pagination: true, //是否显示分页(*) sortable: true, //是否启用排序 sortOrder: 'asc', striped: true, //行间隔色 showExport: true, //是否显示导出 exportDataType: 'all', search: true, detailView: false,//父子表 onExpandRow: function (index, row, $detail) { oInitInitSubTable(index, row, $detail); } }); } function getAttendanceResult() { var TeamGroupId = $("#TeamGroupName").val(); var date = $("#date").val(); $.ajax({ url: "/Employee/getAttendanceResult", type: "post", dataType: 'json', data: { "TeamGroupId": TeamGroupId, "date": date, }, success: function (data) { chkData = eval(data); $('#tablesinglelast').bootstrapTable('load', chkData); }, error: function () { zcy.alert.error("获取考勤表失败"); } }); } ``` 我用bootstrap-table-contextmenu 在getAttendanceResult实现了一个右键菜单 ``` function getAttendanceResult() { //鼠标右键菜单 $('#tablesinglelast').bootstrapTable({ contextMenu: '#context-menu', onContextMenuItem: function(row, $el){ if ($el.data("item") == "properfunctioning") { //var msg = "你确定要设置为考勤?"; //zcy.alert.confirm("请确认操作",msg); console.log(row); zcy.alert.success(""+row+"的考勤记录"); } } }); var TeamGroupId = $("#TeamGroupName").val(); var date = $("#date").val(); $.ajax({ url: "/Employee/getAttendanceResult", type: "post", dataType: 'json', data: { "TeamGroupId": TeamGroupId, "date": date, }, success: function (data) { chkData = eval(data); $('#tablesinglelast').bootstrapTable('load', chkData); }, error: function () { zcy.alert.error("获取考勤表失败"); } }); } ``` ![图片说明](https://img-ask.csdn.net/upload/201906/20/1561022981_497748.png) 但是获取的都是一行的值,获取不到单元格的值,该怎么办呢?
列宽可拖动问题。求高手。
我直接用的jquery的插件实现的列宽拖动,但是碰到有行合并的时候,表格中有列合并的列宽拖动就不好使了,其他的列拖动正常,求高手。 <!DOCTYPE html> <html lang="en"> <head> <style> .a{text-indent:0.3em; } </style> <script src="js/jquery.js"></script> <script src="js/colResizable-1.3.min.js"></script> <script type="text/javascript"> $(function(){ $("#sample2").colResizable({ liveDrag:true, draggingClass:"dragging", }); }); </script> </head> <body> <table id="sample2" width="50%" border="1px" cellpadding="0" cellspacing="0" class="a" align="center"> <tr> <th rowspan="2">header</th><th colspan="2">header</th><th rowspan="2">header</th> </tr> <tr><td >cell</td><td >cell</td></tr> <tr > <td >cell</td><td>cell</td><td >cell</td><td >cell</td> </tr> <tr> <td >cell</td><td>cell</td><td >cell</td><td >cell</td> </tr> <tr> <td >cell</td><td >cell</td><td >cell</td><td >cell</td> </tr> </table> </body> </html> [1]: http://
关于Javascript可视化节点的插件
如图: ![CSDN移动问答][1] [1]: http://img.blog.csdn.net/20131013173639156?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvdTAxMDY3MzE1OA==/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/SouthEast 像这样点击某个节点向四周展开并且能够动态加载的插件有没有知道的,节点可以拖拽的,在网上找了好久都没有找到(注:不是流程图,主要是体现一种关联关系)。
各位大神们,谁知道怎样通过three.js导入外部3d模型,然后可以拖动模型,并且模型的一部分不能被单独拖动,这个问题困扰我很多天,现在还是没办法解决,求助各位大神了,万分感谢!
各位大神们,我现在可以导入3d模型,并且这个模型可以拖动,但是一部分模型被单独拖动,其他模型不动,代码如下: ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>拖拽控件</title> <style> body { margin: 0; overflow: hidden; } #label { position: absolute; padding: 10px; background: rgba(255, 255, 255, 0.6); line-height: 1; border-radius: 5px; } </style> <script src="js/three.js"></script> <script src="js/jquery-1.9.1.js"></script> <script src="js/Detector.js"></script> <script src="js/TrackballControls.js"></script> <script src="js/dat.gui.min.js"></script> <script src="js/stats.min.js"></script> <script src="js/OBJLoader.js"></script> <script src="js/FBXLoader.js"></script> <script src="js/inflate.min.js"></script> <!--拖拽控件--> <script src="js/DragControls.js"></script> <!--可视化平移控件--> <script src="js/TransformControls.js"></script> </head> <body> <div id="WebGL-output"></div> <div id="Stats-output"></div> <div id="label"></div> <script> var objects=[]; var stats = initStats(); var scene, camera, renderer, controls, light, selectObject; // 场景 function initScene() { scene = new THREE.Scene(); } // 相机 function initCamera() { camera = new THREE.PerspectiveCamera(45, window.innerWidth / window.innerHeight, 0.1, 10000); camera.position.set(0, 400, 600); camera.lookAt(new THREE.Vector3(0, 0, 0)); } // 渲染器 function initRenderer() { if (Detector.webgl) { renderer = new THREE.WebGLRenderer({antialias: true}); } else { renderer = new THREE.CanvasRenderer(); } renderer.setSize(window.innerWidth, window.innerHeight); renderer.setClearColor(0x050505); document.body.appendChild(renderer.domElement); } // 初始化模型 function initContent() { var helper = new THREE.GridHelper(1800, 50, 0x4A4A4A); helper.setColors(0x9370DB); scene.add(helper); var loader = new THREE.OBJLoader(); loader.load( "moder/obj/windmill.obj", function ( group ) { group.position.x=400; group.scale.set(20, 20, 20);//模型放大20倍 //group.scale.color(0x3CB37 group.name="groups" scene.add( group ); objects.push(group); } ); var loader = new THREE.OBJLoader(); loader.load( "moder/obj/low.obj", function ( group ) { group.position.x=-400; group.scale.set(20, 20, 20);//模型放大20倍 //group.scale.color(0x3CB37 group.name="groupss"; scene.add( group ); objects.push(group); } ); var loader = new THREE.FBXLoader(); //Samba Dancing idle_2 loader.load( 'moder/fbx/pipeline.fbx', function ( object ) { //console.log(object); object.scale.set(1,1,1); scene.add( object ); objects.push(object); mixers=object.mixer = new THREE.AnimationMixer( object ); var action = object.mixer.clipAction( object.animations[0]); action.play(); object.traverse( function ( child ) { if ( child.isMesh ) { child.castShadow = true; child.receiveShadow = true; } } ); console.log(object); } ); /*var cubeGeometry = new THREE.BoxGeometry(100, 100, 100); var cubeMaterial = new THREE.MeshLambertMaterial({color: 0x9370DB}); var cube = new THREE.Mesh(cubeGeometry, cubeMaterial); cube.position.x = -600; cube.position.y = 50; cube.name = "cubes"; scene.add(cube); var sphereGeometry = new THREE.SphereGeometry(50, 50, 50, 50); var sphereMaterial = new THREE.MeshLambertMaterial({color: 0x3CB371}); var sphere = new THREE.Mesh(sphereGeometry, sphereMaterial); sphere.position.x = 200; sphere.position.y = 50; sphere.name = "sphere"; // sphere.position.z = 200; scene.add(sphere); var cylinderGeometry = new THREE.CylinderGeometry(50, 50, 100, 100); var cylinderMaterial = new THREE.MeshLambertMaterial({color: 0xCD7054}); var cylinder = new THREE.Mesh(cylinderGeometry, cylinderMaterial); cylinder.position.x = -200; cylinder.position.y = 50; cylinder.name = "cylinder"; scene.add(cylinder);*/ } console.log(objects); // 鼠标双击触发的方法 function onMouseDblclick(event) { // 获取 raycaster 和所有模型相交的数组,其中的元素按照距离排序,越近的越靠前 var intersects = getIntersects(event); // 获取选中最近的 Mesh 对象 if (intersects.length != 0 && intersects[0].object ) { selectObject = intersects[0].object.parent; changeMaterial(selectObject); console.log(changeMaterial); } else { alert("未选中 Mesh!"); } } // 获取与射线相交的对象数组 function getIntersects(event) { event.preventDefault(); console.log("event.clientX:" + event.clientX) console.log("event.clientY:" + event.clientY) // 声明 raycaster 和 mouse 变量 var raycaster = new THREE.Raycaster(); var mouse = new THREE.Vector2(); // 通过鼠标点击位置,计算出 raycaster 所需点的位置,以屏幕为中心点,范围 -1 到 1 mouse.x = (event.clientX / window.innerWidth) * 2 - 1; mouse.y = -(event.clientY / window.innerHeight) * 2 + 1; //通过鼠标点击的位置(二维坐标)和当前相机的矩阵计算出射线位置 raycaster.setFromCamera(mouse, camera); // 获取与射线相交的对象数组,其中的元素按照距离排序,越近的越靠前 var intersects = raycaster.intersectObjects(scene.children); var intersects=intersects.parent; console.log(intersects); //返回选中的对象 return intersects; } // 窗口变动触发的方法 function onWindowResize() { camera.aspect = window.innerWidth / window.innerHeight; camera.updateProjectionMatrix(); renderer.setSize(window.innerWidth, window.innerHeight); } // 键盘按下触发的方法 function onKeyDown(event) { switch (event.keyCode) { case 13: initCamera(); initControls(); break; } } // 改变对象材质属性 function changeMaterial(object) { var material = new THREE.MeshLambertMaterial({ color: 0xffffff * Math.random(), transparent: object.material.transparent ? false : true, opacity: 0.8, }); object.material = material; } // 初始化轨迹球控件 function initControls() { controls = new THREE.TrackballControls(camera, renderer.domElement); // controls.noRotate = true; controls.noPan = true; // 视角最小距离 controls.minDistance = 1000; // 视角最远距离 controls.maxDistance = 5000; } // 添加拖拽控件 function initDragControls() { // 添加平移控件 var transformControls = new THREE.TransformControls(camera, renderer.domElement); scene.add(transformControls); // 过滤不是 Mesh 的物体,例如辅助网格 //var objects = []; /*for (let i = 0; i < scene.children.length; i++) { if (scene.children[i].isMesh) { objects.push(scene.children[i]); } //objects.push(object[i].parent); }*/ // 初始化拖拽控件 var dragControls = new THREE.DragControls(objects, camera, renderer.domElement); // 鼠标略过事件 dragControls.addEventListener('hoveron', function (event) { // 让变换控件对象和选中的对象绑定 transformControls.attach(event.object); }); // 开始拖拽 dragControls.addEventListener('dragstart', function (event) { controls.enabled = false; }); // 拖拽结束 dragControls.addEventListener('dragend', function (event) { controls.enabled = true; }); console.log(objects.length); } // 初始化灯光 function initLight() { light = new THREE.SpotLight(0xffffff); light.position.set(-300, 600, -400); light.castShadow = true; scene.add(light); scene.add(new THREE.AmbientLight(0x5C5C5C)); } // 初始化 dat.GUI function initGui() { // 保存需要修改相关数据的对象 gui = new function () { } // 属性添加到控件 var guiControls = new dat.GUI(); } // 初始化性能插件 function initStats() { var stats = new Stats(); stats.domElement.style.position = 'absolute'; stats.domElement.style.left = '0px'; stats.domElement.style.top = '0px'; document.body.appendChild(stats.domElement); return stats; } // 更新div的位置 function renderDiv(object) { // 获取窗口的一半高度和宽度 let halfWidth = window.innerWidth / 2; let halfHeight = window.innerHeight / 2; // 逆转相机求出二维坐标 let vector = object.position.clone().project(camera); // 修改 div 的位置 $("#label").css({ left: vector.x * halfWidth + halfWidth, top: -vector.y * halfHeight + halfHeight - object.position.y }); // 显示模型信息 //$("#label").text("name:" + object.name); } // 更新控件 function update() { stats.update(); controls.update(); controls.handleResize(); //transformControls.update(); } // 初始化 function init() { initScene(); initCamera(); initRenderer(); initContent(); initLight(); initControls(); initGui(); initDragControls(); // addEventListener('dblclick', onMouseDblclick, false); addEventListener('resize', onWindowResize, false); addEventListener('keydown', onKeyDown, false); } function animate() { if (selectObject != undefined && selectObject != null) { renderDiv(selectObject); } requestAnimationFrame(animate); renderer.render(scene, camera); update(); } init(); animate(); </script> </body> </html> ``` 一部分模型被单独拖动的效果如下: ![图片说明](https://img-ask.csdn.net/upload/201911/04/1572863955_100421.png) 然后我再修改当鼠标略过事件: ![图片说明](https://img-ask.csdn.net/upload/201911/04/1572864098_336978.png) 整个模型可以一起被拖动,但是模型混乱:效果图如下: ![图片说明](https://img-ask.csdn.net/upload/201911/05/1572916540_633061.png) 希望路过的好心人帮帮忙,万分感谢!!!!!!
vue-awesome-swiper 手势缩放无效
问题描述: 想在vue项目中使用vue-awesome-swiper实现相册查看功能,测试的时候发现使用写死的图片src 时手势缩放没有问题,但是图片src集合换到从后台获取到再赋值的,手势缩放就不起作用了,不知道是什么原因。 用的vue template, 后台获取到的数据已经渲染到dom中,手机上测试切换没有问题,双击放大也可以,就是手势缩放或者双击放大后图片不能拖拽移动查看(用写死的图片src是可以的)。 vue项目依赖或版本: ``` "devDependencies": { "axios": "^0.15.3", "babel-plugin-component": "^0.10.1", "babel-plugin-transform-object-rest-spread": "^6.26.0", "bootstrap-sass": "^3.3.7", "cross-env": "^3.2.3", "jquery": "^3.1.1", "laravel-mix": "^0.12.1", "less": "^2.7.3", "less-loader": "^4.0.5", "lodash": "^4.17.4", "postcss-px2rem": "^0.3.0", "vue-lazyload": "^1.2.6" }, "dependencies": { "fastclick": "^1.0.6", "leancloud-realtime": "^4.0.0-alpha.3", "leancloud-realtime-plugin-typed-messages": "^3.0.0", "leancloud-storage": "^3.4.2", "mint-ui": "^2.2.11", "moment": "^2.19.1", "vee-validate": "^2.0.0", "vue": "^2.5.13", "vue-awesome-swiper": "^2.6.7", "vue-resource": "^1.3.4", "vue-router": "^3.0.1", "vuex": "^3.0.1" } ``` 问题出现的环境背景及自己尝试过哪些方法: 试过使用另一个图片预览插件 [PhotoSwipe](http://photoswipe.com/ ""):PhotoSwipe,这个插件体验感比较好,但是插件需要预先知道图片的宽高,这个目前还没有时间研究。 相关代码: ``` <style> .viewImg .swiper-slide img { width: 100%; } </style> <template> <div class="viewImg" > <a class="btn-close f-r"><img src="/images/icon-close.png" @click="closeViewer" alt="关闭" title="关闭"></a> <swiper :options="swiperOption" ref="mySwiper"> <swiper-slide v-for="img in images" :key="img.id"> <div class="swiper-zoom-container"> <img :data-src="img.smallSizeUrl" class="swiper-lazy"> </div> </swiper-slide> <div class="swiper-button-prev" slot="button-prev"></div> <div class="swiper-button-next" slot="button-next"></div> </swiper> </div> </template> <script> import 'swiper/dist/css/swiper.css' ; import { swiper, swiperSlide } from 'vue-awesome-swiper' export default { components: { swiper, swiperSlide }, data() { return {swiperOption: { allowTouchMove: true, width: window.innerWidth, notNextTick: false, observer:true,//修改swiper自己或子元素时,自动初始化swiper observeParents:true,//修改swiper的父元素时,自动初始化swiper loadPrevNext: true, lazy: { loadPrevNext: true, }, lazyLoading : true, lazyLoadingInPrevNext: true, // 设置为true允许将延迟加载应用到最接近的slide的图片(前一个和后一个slide)。 zoom: true, grabCursor: true, // 设置为true时,鼠标覆盖Swiper时指针会变成手掌形状,拖动时指针会变成抓手形状。(根据浏览器形状有所不同) pagination: { el: '.swiper-pagination' }, navigation: { nextEl: '.swiper-button-next', prevEl: '.swiper-button-prev' } } } }, //定义这个sweiper对象 computed: { swiper() { return this.$refs.mySwiper.swiper; } }, mounted () { //这边就可以使用swiper这个对象去使用swiper官网中的那些方法 // this.swiper.slideTo(0, 1, false); }, props: { images: { required: true } }, methods:{ closeViewer: function(){ this.viewImg = false; } } } </script> ``` 我期待的结果是什么?实际看到的错误信息又是什么: 需要实现流畅的相册查看功能,支持预加载、流畅切换以及手机中手势缩放查看。 [vue-awesome-swiper 的demo](https://surmon-china.github.io/vue-awesome-swiper/ "")里可以看到都可以满足目前的主要需求,但是我在项目中出现了以上问题,求助。
asp.net webuploader多图片上传并保存文件路径到数据库
![图片说明](https://img-ask.csdn.net/upload/201906/22/1561187942_114655.jpg) 要做一个滚动窗功能,使用webuploader插件 不知道在哪获取文件路径,保存到数据库里 上传的upload.js ``` (function( $ ){ // 当domReady的时候开始初始化 $(function() { var $wrap = $('.uploader-list-container'), // 图片容器 $queue = $( '<ul class="filelist"></ul>' ) .appendTo( $wrap.find( '.queueList' ) ), // 状态栏,包括进度和控制按钮 $statusBar = $wrap.find( '.statusBar' ), // 文件总体选择信息。 $info = $statusBar.find( '.info' ), // 上传按钮 $upload = $wrap.find( '.uploadBtn' ), // 没选择文件之前的内容。 $placeHolder = $wrap.find( '.placeholder' ), $progress = $statusBar.find( '.progress' ).hide(), // 添加的文件数量 fileCount = 0, // 添加的文件总大小 fileSize = 0, // 优化retina, 在retina下这个值是2 ratio = window.devicePixelRatio || 1, // 缩略图大小 thumbnailWidth = 110 * ratio, thumbnailHeight = 110 * ratio, // 可能有pedding, ready, uploading, confirm, done. state = 'pedding', // 所有文件的进度信息,key为file id percentages = {}, // 判断浏览器是否支持图片的base64 isSupportBase64 = ( function() { var data = new Image(); var support = true; data.onload = data.onerror = function() { if( this.width != 1 || this.height != 1 ) { support = false; } } data.src = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw=="; return support; } )(), // 检测是否已经安装flash,检测flash的版本 flashVersion = ( function() { var version; try { version = navigator.plugins[ 'Shockwave Flash' ]; version = version.description; } catch ( ex ) { try { version = new ActiveXObject('ShockwaveFlash.ShockwaveFlash') .GetVariable('$version'); } catch ( ex2 ) { version = '0.0'; } } version = version.match( /\d+/g ); return parseFloat( version[ 0 ] + '.' + version[ 1 ], 10 ); } )(), supportTransition = (function(){ var s = document.createElement('p').style, r = 'transition' in s || 'WebkitTransition' in s || 'MozTransition' in s || 'msTransition' in s || 'OTransition' in s; s = null; return r; })(), // WebUploader实例 uploader; if ( !WebUploader.Uploader.support('flash') && WebUploader.browser.ie ) { // flash 安装了但是版本过低。 if (flashVersion) { (function(container) { window['expressinstallcallback'] = function( state ) { switch(state) { case 'Download.Cancelled': alert('您取消了更新!') break; case 'Download.Failed': alert('安装失败') break; default: alert('安装已成功,请刷新!'); break; } delete window['expressinstallcallback']; }; var swf = 'expressInstall.swf'; // insert flash object var html = '<object type="application/' + 'x-shockwave-flash" data="' + swf + '" '; if (WebUploader.browser.ie) { html += 'classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" '; } html += 'width="100%" height="100%" style="outline:0">' + '<param name="movie" value="' + swf + '" />' + '<param name="wmode" value="transparent" />' + '<param name="allowscriptaccess" value="always" />' + '</object>'; container.html(html); })($wrap); // 压根就没有安转。 } else { $wrap.html('<a href="http://www.adobe.com/go/getflashplayer" target="_blank" border="0"><img alt="get flash player" src="http://www.adobe.com/macromedia/style_guide/images/160x41_Get_Flash_Player.jpg" /></a>'); } return; } else if (!WebUploader.Uploader.support()) { alert( 'Web Uploader 不支持您的浏览器!'); return; } // 实例化 uploader = WebUploader.create({ pick: { id: '#filePicker-2', label: '点击选择图片' }, formData: { uid: 123 }, dnd: '#dndArea', paste: '#uploader', swf: '../Uploader.swf', chunked: false, chunkSize: 512 * 1024, server: './Ajax/UpLoad.ashx', // runtimeOrder: 'flash', accept: { title: 'Images', extensions: 'gif,jpg,jpeg,bmp,png', mimeTypes: 'image/*' }, // 禁掉全局的拖拽功能。这样不会出现图片拖进页面的时候,把图片打开。 disableGlobalDnd: true, fileNumLimit: 300, fileSizeLimit: 200 * 1024 * 1024, // 200 M fileSingleSizeLimit: 50 * 1024 * 1024 // 50 M }); // 拖拽时不接受 js, txt 文件。 uploader.on( 'dndAccept', function( items ) { var denied = false, len = items.length, i = 0, // 修改js类型 unAllowed = 'text/plain;application/javascript '; for ( ; i < len; i++ ) { // 如果在列表里面 if ( ~unAllowed.indexOf( items[ i ].type ) ) { denied = true; break; } } return !denied; }); uploader.on('dialogOpen', function() { console.log('here'); }); // uploader.on('filesQueued', function() { // uploader.sort(function( a, b ) { // if ( a.name < b.name ) // return -1; // if ( a.name > b.name ) // return 1; // return 0; // }); // }); // 添加“添加文件”的按钮, uploader.addButton({ id: '#filePicker2', label: '继续添加' }); uploader.on('ready', function() { window.uploader = uploader; }); // 当有文件添加进来时执行,负责view的创建 function addFile(file) { alert(file.name); var $li = $( '<li id="' + file.id + '">' + '<p class="title">' + file.name + '</p>' + '<p class="imgWrap"></p>'+ '<p class="progress"><span></span></p>' + '</li>' ), $btns = $('<div class="file-panel">' + '<span class="cancel">删除</span>' + '<span class="rotateRight">向右旋转</span>' + '<span class="rotateLeft">向左旋转</span></div>').appendTo( $li ), $prgress = $li.find('p.progress span'), $wrap = $li.find( 'p.imgWrap' ), $info = $('<p class="error"></p>'), showError = function( code ) { switch( code ) { case 'exceed_size': text = '文件大小超出'; break; case 'interrupt': text = '上传暂停'; break; default: text = '上传失败,请重试'; break; } $info.text( text ).appendTo( $li ); }; if ( file.getStatus() === 'invalid' ) { showError( file.statusText ); } else { // @todo lazyload $wrap.text( '预览中' ); uploader.makeThumb( file, function( error, src ) { var img; if ( error ) { $wrap.text( '不能预览' ); return; } if( isSupportBase64 ) { img = $('<img src="'+src+'">'); $wrap.empty().append( img ); } else { $.ajax('../server/preview.php', { method: 'POST', data: src, dataType:'json' }).done(function( response ) { if (response.result) { img = $('<img src="'+response.result+'">'); $wrap.empty().append( img ); } else { $wrap.text("预览出错"); } }); } }, thumbnailWidth, thumbnailHeight ); percentages[ file.id ] = [ file.size, 0 ]; file.rotation = 0; } file.on('statuschange', function( cur, prev ) { if ( prev === 'progress' ) { $prgress.hide().width(0); } else if ( prev === 'queued' ) { $li.off( 'mouseenter mouseleave' ); $btns.remove(); } // 成功 if ( cur === 'error' || cur === 'invalid' ) { console.log( file.statusText ); showError( file.statusText ); percentages[ file.id ][ 1 ] = 1; } else if ( cur === 'interrupt' ) { showError( 'interrupt' ); } else if ( cur === 'queued' ) { percentages[ file.id ][ 1 ] = 0; } else if ( cur === 'progress' ) { $info.remove(); $prgress.css('display', 'block'); } else if ( cur === 'complete' ) { $li.append( '<span class="success"></span>' ); } $li.removeClass( 'state-' + prev ).addClass( 'state-' + cur ); }); $li.on( 'mouseenter', function() { $btns.stop().animate({height: 30}); }); $li.on( 'mouseleave', function() { $btns.stop().animate({height: 0}); }); $btns.on( 'click', 'span', function() { var index = $(this).index(), deg; switch ( index ) { case 0: uploader.removeFile( file ); return; case 1: file.rotation += 90; break; case 2: file.rotation -= 90; break; } if ( supportTransition ) { deg = 'rotate(' + file.rotation + 'deg)'; $wrap.css({ '-webkit-transform': deg, '-mos-transform': deg, '-o-transform': deg, 'transform': deg }); } else { $wrap.css( 'filter', 'progid:DXImageTransform.Microsoft.BasicImage(rotation='+ (~~((file.rotation/90)%4 + 4)%4) +')'); // use jquery animate to rotation // $({ // rotation: rotation // }).animate({ // rotation: file.rotation // }, { // easing: 'linear', // step: function( now ) { // now = now * Math.PI / 180; // var cos = Math.cos( now ), // sin = Math.sin( now ); // $wrap.css( 'filter', "progid:DXImageTransform.Microsoft.Matrix(M11=" + cos + ",M12=" + (-sin) + ",M21=" + sin + ",M22=" + cos + ",SizingMethod='auto expand')"); // } // }); } }); $li.appendTo( $queue ); } // 负责view的销毁 function removeFile( file ) { var $li = $('#'+file.id); delete percentages[ file.id ]; updateTotalProgress(); $li.off().find('.file-panel').off().end().remove(); } function updateTotalProgress() { var loaded = 0, total = 0, spans = $progress.children(), percent; $.each( percentages, function( k, v ) { total += v[ 0 ]; loaded += v[ 0 ] * v[ 1 ]; } ); percent = total ? loaded / total : 0; spans.eq( 0 ).text( Math.round( percent * 100 ) + '%' ); spans.eq( 1 ).css( 'width', Math.round( percent * 100 ) + '%' ); updateStatus(); } function updateStatus() { var text = '', stats; if ( state === 'ready' ) { text = '选中' + fileCount + '张图片,共' + WebUploader.formatSize( fileSize ) + '。'; } else if ( state === 'confirm' ) { stats = uploader.getStats(); if ( stats.uploadFailNum ) { text = '已成功上传' + stats.successNum+ '张照片至XX相册,'+ stats.uploadFailNum + '张照片上传失败,<a class="retry" href="#">重新上传</a>失败图片或<a class="ignore" href="#">忽略</a>' } } else { stats = uploader.getStats(); text = '共' + fileCount + '张(' + WebUploader.formatSize( fileSize ) + '),已上传' + stats.successNum + '张'; if ( stats.uploadFailNum ) { text += ',失败' + stats.uploadFailNum + '张'; } } $info.html( text ); } function setState( val ) { var file, stats; if ( val === state ) { return; } $upload.removeClass( 'state-' + state ); $upload.addClass( 'state-' + val ); state = val; switch ( state ) { case 'pedding': $placeHolder.removeClass( 'element-invisible' ); $queue.hide(); $statusBar.addClass( 'element-invisible' ); uploader.refresh(); break; case 'ready': $placeHolder.addClass( 'element-invisible' ); $( '#filePicker2' ).removeClass( 'element-invisible'); $queue.show(); $statusBar.removeClass('element-invisible'); uploader.refresh(); break; case 'uploading': $( '#filePicker2' ).addClass( 'element-invisible' ); $progress.show(); $upload.text( '暂停上传' ); break; case 'paused': $progress.show(); $upload.text( '继续上传' ); break; case 'confirm': $progress.hide(); $( '#filePicker2' ).removeClass( 'element-invisible' ); $upload.text( '开始上传' ); stats = uploader.getStats(); if ( stats.successNum && !stats.uploadFailNum ) { setState( 'finish' ); return; } break; case 'finish': stats = uploader.getStats(); if ( stats.successNum ) { alert( '上传成功' ); } else { // 没有成功的图片,重设 state = 'done'; location.reload(); } break; } updateStatus(); } uploader.onUploadProgress = function( file, percentage ) { var $li = $('#'+file.id), $percent = $li.find('.progress span'); $percent.css( 'width', percentage * 100 + '%' ); percentages[ file.id ][ 1 ] = percentage; updateTotalProgress(); }; uploader.onFileQueued = function( file ) { fileCount++; fileSize += file.size; if ( fileCount === 1 ) { $placeHolder.addClass( 'element-invisible' ); $statusBar.show(); } addFile( file ); setState( 'ready' ); updateTotalProgress(); }; uploader.onFileDequeued = function( file ) { fileCount--; fileSize -= file.size; if ( !fileCount ) { setState( 'pedding' ); } removeFile( file ); updateTotalProgress(); }; uploader.on( 'all', function( type ) { var stats; switch( type ) { case 'uploadFinished': setState( 'confirm' ); break; case 'startUpload': setState( 'uploading' ); break; case 'stopUpload': setState( 'paused' ); break; } }); uploader.onError = function( code ) { alert( 'Eroor: ' + code ); }; $upload.on('click', function() { if ( $(this).hasClass( 'disabled' ) ) { return false; } if ( state === 'ready' ) { uploader.upload(); } else if ( state === 'paused' ) { uploader.upload(); } else if ( state === 'uploading' ) { uploader.stop(); } }); $info.on( 'click', '.retry', function() { uploader.retry(); } ); $info.on( 'click', '.ignore', function() { alert( 'todo' ); } ); $upload.addClass( 'state-' + state ); updateTotalProgress(); }); })( jQuery ); ``` ashx文件 ``` <%@ WebHandler Language="C#" Class="Handler" %> using System; using System.Web; using System.IO; using System.Text; public class Handler : IHttpHandler { public void ProcessRequest(HttpContext context) { context.Response.ContentType = "text/plain"; //指定字符集 context.Response.ContentEncoding = System.Text.Encoding.UTF8; if (context.Request["REQUEST_METHOD"] == "OPTIONS") { context.Response.End(); } SaveFile(); } /// <summary> /// 文件保存操作 /// </summary> /// <param name="basePath"></param> private void SaveFile(string basePath = "~/Upload/Images/") { var name = string.Empty; basePath = (basePath.IndexOf("~") > -1) ? System.Web.HttpContext.Current.Server.MapPath(basePath) : basePath; // basePath = FileHelper.GetUploadPath(); HttpFileCollection files = System.Web.HttpContext.Current.Request.Files; //如果目录不存在,则创建目录 if (!Directory.Exists(basePath)) { Directory.CreateDirectory(basePath); } var suffix = files[0].ContentType.Split('/'); //获取文件格式 var _suffix = suffix[1].Equals("jpeg", StringComparison.CurrentCultureIgnoreCase) ? ".jpg" : suffix[1]; var _temp = System.Web.HttpContext.Current.Request["name"]; //如果不修改文件名,则创建随机文件名 //if (!string.IsNullOrEmpty(_temp)) //{ // name = _temp; //} //else //{ Random rand = new Random(24 * (int)DateTime.Now.Ticks); name = rand.Next() + "." + _suffix; //} //文件保存 var full = basePath + name; files[0].SaveAs(full); var _result = "{\"jsonrpc\" : \"2.0\", \"result\" : null, \"Imgurl\" : \"" + name + "\"}"; System.Web.HttpContext.Current.Response.Write(_result); } public bool IsReusable { get { return false; } } } ```
C#,用zyupload做Excel导入到数据库,数据多,加载慢,求zyupload的加载提示的事件
@{ ViewBag.Title = "Info"; } <h6>Info</h6> <script src="../../TopsLib/Scripts/jquery-1.7.1.min.js"></script> <link href="../../zyupload/skins/zyupload-1.0.0.min.css" rel="stylesheet" /> <script src="../../zyupload/zyupload-1.0.0.min.js"></script> <script type="text/javascript"> $(function(){ // 初始化插件 $("#zyupload").zyUpload({ width : "650px", // 宽度 height : "400px", // 宽度 itemWidth : "140px", // 文件项的宽度 itemHeight : "115px", // 文件项的高度 url : "Upload", fileType : ["xls"],// 上传文件的类型 fileSize : 51200000, // 上传文件的大小 multiple : true, // 是否可以多个文件上传 dragDrop : true, // 是否可以拖动上传文件 tailor : true, // 是否可以裁剪图片 del: true, // 是否可以删除文件 onbeforeSend: function () { //上传提示 alert("正在上传"); $("#uploadInf").append("<p>正在上传,请时候....</p>"); }, finishDel: false, // 是否在上传文件完成后删除预览 /* 外部获得的回调接口 */ onSelect: function (selectFiles, allFiles) { // 选择文件的回调方法 selectFile:当前选中的文件 allFiles:还没上传的全部文件 alert("当前选择了以下文件"); console.info("当前选择了以下文件:"); console.info(selectFiles); }, onDelete: function (file, files) { // 删除一个文件的回调方法 file:当前删除的文件 files:删除之后的文件 alert("当前删除了此文件"); console.info("当前删除了此文件:"); console.info(file.name); }, onSuccess: function (file, response) { // 文件上传成功的回调方法 alert("此文件上传成功"); console.info("此文件上传成功:"); console.info(file.name); console.info("此文件上传到服务器地址:"); console.info(response); $("#uploadInf").append("<p>上传成功,文件地址是:" + response + "</p>"); }, onFailure: function (file, response) { // 文件上传失败的回调方法 alert("此文件上传失败"); console.info("此文件上传失败:"); console.info(file.name); }, onComplete: function (response) { // 上传完成的回调方法 alert("文件上传完成"); console.info("文件上传完成"); console.info(response); } }); }); </script> <div id="zyupload" class="zyupload"></div>
推荐 130 个令你眼前一亮的网站,总有一个用得着
总结了大学生活两年来,发现的 130 余个黑科技网站,总有一个会让你眼前一亮,赶紧收藏!
在中国程序员是青春饭吗?
今年,我也32了 ,为了不给大家误导,咨询了猎头、圈内好友,以及年过35岁的几位老程序员……舍了老脸去揭人家伤疤……希望能给大家以帮助,记得帮我点赞哦。 目录: 你以为的人生 一次又一次的伤害 猎头界的真相 如何应对互联网行业的「中年危机」 一、你以为的人生 刚入行时,拿着傲人的工资,想着好好干,以为我们的人生是这样的: 等真到了那一天,你会发现,你的人生很可能是这样的: ...
我在支付宝花了1分钟,查到了女朋友的开房记录!
在大数据时代下,不管你做什么都会留下蛛丝马迹,只要学会把各种软件运用到极致,捉奸简直轻而易举。今天就来给大家分享一下,什么叫大数据抓出轨。据史料证明,马爸爸年轻时曾被...
程序员请照顾好自己,周末病魔差点一套带走我。
程序员在一个周末的时间,得了重病,差点当场去世,还好及时挽救回来了。
卸载 x 雷某度!GitHub 标星 1.5w+,从此我只用这款全能高速下载工具!
作者 | Rocky0429 来源 | Python空间 大家好,我是 Rocky0429,一个喜欢在网上收集各种资源的蒟蒻… 网上资源眼花缭乱,下载的方式也同样千奇百怪,比如 BT 下载,磁力链接,网盘资源等等等等,下个资源可真不容易,不一样的方式要用不同的下载软件,因此某比较有名的 x 雷和某度网盘成了我经常使用的工具。 作为一个没有钱的穷鬼,某度网盘几十 kb 的下载速度让我...
20道你必须要背会的微服务面试题,面试一定会被问到
写在前面: 在学习springcloud之前大家一定要先了解下,常见的面试题有那块,然后我们带着问题去学习这个微服务技术,那么就会更加理解springcloud技术。如果你已经学了springcloud,那么在准备面试的时候,一定要看看看这些面试题。 文章目录1、什么是微服务?2、微服务之间是如何通讯的?3、springcloud 与dubbo有哪些区别?4、请谈谈对SpringBoot 和S...
讲真,这两个IDE插件,可以让你写出质量杠杠的代码
周末躺在床上看《拯救大兵瑞恩》 周末在闲逛的时候,发现了两个优秀的 IDE 插件,据说可以提高代码的质量,我就安装了一下,试了试以后发现,确实很不错,就推荐给大家。 01、Alibaba Java 代码规范插件 《阿里巴巴 Java 开发手册》,相信大家都不会感到陌生,其 IDEA 插件的下载次数据说达到了 80 万次,我今天又贡献了一次。嘿嘿。 该项目的插件地址: https://github....
为什么猝死的都是程序员,基本上不见产品经理猝死呢?
相信大家时不时听到程序员猝死的消息,但是基本上听不到产品经理猝死的消息,这是为什么呢? 我们先百度搜一下:程序员猝死,出现将近700多万条搜索结果: 搜索一下:产品经理猝死,只有400万条的搜索结果,从搜索结果数量上来看,程序员猝死的搜索结果就比产品经理猝死的搜索结果高了一倍,而且从下图可以看到,首页里面的五条搜索结果,其实只有两条才是符合条件。 所以程序员猝死的概率真的比产品经理大,并不是错...
毕业5年,我问遍了身边的大佬,总结了他们的学习方法
我问了身边10个大佬,总结了他们的学习方法,原来成功都是有迹可循的。
推荐10个堪称神器的学习网站
每天都会收到很多读者的私信,问我:“二哥,有什么推荐的学习网站吗?最近很浮躁,手头的一些网站都看烦了,想看看二哥这里有什么新鲜货。” 今天一早做了个恶梦,梦到被老板辞退了。虽然说在我们公司,只有我辞退老板的份,没有老板辞退我这一说,但是还是被吓得 4 点多都起来了。(主要是因为我掌握着公司所有的核心源码,哈哈哈) 既然 4 点多起来,就得好好利用起来。于是我就挑选了 10 个堪称神器的学习网站,推...
这些软件太强了,Windows必装!尤其程序员!
Windows可谓是大多数人的生产力工具,集娱乐办公于一体,虽然在程序员这个群体中都说苹果是信仰,但是大部分不都是从Windows过来的,而且现在依然有很多的程序员用Windows。 所以,今天我就把我私藏的Windows必装的软件分享给大家,如果有一个你没有用过甚至没有听过,那你就赚了????,这可都是提升你幸福感的高效率生产力工具哦! 走起!???? NO、1 ScreenToGif 屏幕,摄像头和白板...
阿里面试,面试官没想到一个ArrayList,我都能跟他扯半小时
我是真的没想到,面试官会这样问我ArrayList。
曾经优秀的人,怎么就突然不优秀了。
职场上有很多辛酸事,很多合伙人出局的故事,很多技术骨干被裁员的故事。说来模板都类似,曾经是名校毕业,曾经是优秀员工,曾经被领导表扬,曾经业绩突出,然而突然有一天,因为种种原因,被裁员了,...
大学四年因为知道了这32个网站,我成了别人眼中的大神!
依稀记得,毕业那天,我们导员发给我毕业证的时候对我说“你可是咱们系的风云人物啊”,哎呀,别提当时多开心啦????,嗯,我们导员是所有导员中最帅的一个,真的???? 不过,导员说的是实话,很多人都叫我大神的,为啥,因为我知道这32个网站啊,你说强不强????,这次是绝对的干货,看好啦,走起来! PS:每个网站都是学计算机混互联网必须知道的,真的牛杯,我就不过多介绍了,大家自行探索,觉得没用的,尽管留言吐槽吧???? 社...
良心推荐,我珍藏的一些Chrome插件
上次搬家的时候,发了一个朋友圈,附带的照片中不小心暴露了自己的 Chrome 浏览器插件之多,于是就有小伙伴评论说分享一下我觉得还不错的浏览器插件。 我下面就把我日常工作和学习中经常用到的一些 Chrome 浏览器插件分享给大家,随便一个都能提高你的“生活品质”和工作效率。 Markdown Here Markdown Here 可以让你更愉快的写邮件,由于支持 Markdown 直接转电子邮...
看完这篇HTTP,跟面试官扯皮就没问题了
我是一名程序员,我的主要编程语言是 Java,我更是一名 Web 开发人员,所以我必须要了解 HTTP,所以本篇文章就来带你从 HTTP 入门到进阶,看完让你有一种恍然大悟、醍醐灌顶的感觉。 最初在有网络之前,我们的电脑都是单机的,单机系统是孤立的,我还记得 05 年前那会儿家里有个电脑,想打电脑游戏还得两个人在一个电脑上玩儿,及其不方便。我就想为什么家里人不让上网,我的同学 xxx 家里有网,每...
2020 年,大火的 Python 和 JavaScript 是否会被取而代之?
Python 和 JavaScript 是目前最火的两大编程语言,但是2020 年,什么编程语言将会取而代之呢? 作者 |Richard Kenneth Eng 译者 |明明如月,责编 | 郭芮 出品 | CSDN(ID:CSDNnews) 以下为译文: Python 和 JavaScript 是目前最火的两大编程语言。然而,他们不可能永远屹立不倒。最终,必将像其他编程语言一...
史上最全的IDEA快捷键总结
现在Idea成了主流开发工具,这篇博客对其使用的快捷键做了总结,希望对大家的开发工作有所帮助。
阿里程序员写了一个新手都写不出的低级bug,被骂惨了。
这种新手都不会范的错,居然被一个工作好几年的小伙子写出来,差点被当场开除了。
谁是华为扫地僧?
是的,华为也有扫地僧!2020年2月11-12日,“养在深闺人不知”的华为2012实验室扫地僧们,将在华为开发者大会2020(Cloud)上,和大家见面。到时,你可以和扫地僧们,吃一个洋...
Flutter 会不会被苹果限制其发展?
这个可能性是存在的,而且不止是 flutter、react-native 、weex 、uni-app 、taro 、Hippy等都存在这个风险,虽然有些框架对比起 flutter 其他框架存在时间稍长,但是这不可否认它们一直都存在这个风向。 只要不是平台自己的亲儿子,那么肯定存在被限制发展的风险,所以这件事上是风险和收益之间的博弈,这是一个“后妈和前任之间的太极。” 先说现状 如今各大平台,如:...
Idea 中最常用的10款插件(提高开发效率),一定要学会使用!
学习使用一些插件,可以提高开发效率。对于我们开发人员很有帮助。这篇博客介绍了开发中使用的插件。
AI 没让人类失业,搞 AI 的人先失业了
最近和几个 AI 领域的大佬闲聊 根据他们讲的消息和段子 改编出下面这个故事 如有雷同 都是巧合 1. 老王创业失败,被限制高消费 “这里写我跑路的消息实在太夸张了。” 王葱葱哼笑一下,把消息分享给群里。 阿杰也看了消息,笑了笑。在座几位也都笑了。 王葱葱是个有名的人物,21岁那年以全额奖学金进入 KMU 攻读人工智能博士,累计发表论文 40 余篇,个人技术博客更是成为深度学习领域内风向标。 ...
2020年,冯唐49岁:我给20、30岁IT职场年轻人的建议
点击“技术领导力”关注∆每天早上8:30推送 作者|Mr.K 编辑| Emma 来源|技术领导力(ID:jishulingdaoli) 前天的推文《冯唐:职场人35岁以后,方法论比经验重要》,收到了不少读者的反馈,觉得挺受启发。其实,冯唐写了不少关于职场方面的文章,都挺不错的。可惜大家只记住了“春风十里不如你”、“如何避免成为油腻腻的中年人”等不那么正经的文章。 本文整理了冯...
最全最强!世界大学计算机专业排名总结!
我正在参与CSDN200进20,希望得到您的支持,扫码续投票5次。感谢您! (为表示感谢,您投票后私信我,我把我总结的人工智能手推笔记和思维导图发送给您,感谢!) 目录 泰晤士高等教育世界大学排名 QS 世界大学排名 US News 世界大学排名 世界大学学术排名(Academic Ranking of World Universities) 泰晤士高等教育世界大学排名 中国共...
作为一名大学生,如何在B站上快乐的学习?
B站是个宝,谁用谁知道???? 作为一名大学生,你必须掌握的一项能力就是自学能力,很多看起来很牛X的人,你可以了解下,人家私底下一定是花大量的时间自学的,你可能会说,我也想学习啊,可是嘞,该学习啥嘞,不怕告诉你,互联网时代,最不缺的就是学习资源,最宝贵的是啥? 你可能会说是时间,不,不是时间,而是你的注意力,懂了吧! 那么,你说学习资源多,我咋不知道,那今天我就告诉你一个你必须知道的学习的地方,人称...
那些年,我们信了课本里的那些鬼话
教材永远都是有错误的,从小学到大学,我们不断的学习了很多错误知识。 斑羚飞渡 在我们学习的很多小学课文里,有很多是错误文章,或者说是假课文。像《斑羚飞渡》: 随着镰刀头羊的那声吼叫,整个斑羚群迅速分成两拨,老年斑羚为一拨,年轻斑羚为一拨。 就在这时,我看见,从那拨老斑羚里走出一只公斑羚来。公斑羚朝那拨年轻斑羚示意性地咩了一声,一只半大的斑羚应声走了出来。一老一少走到伤心崖,后退了几步,突...
一个程序在计算机中是如何运行的?超级干货!!!
强烈声明:本文很干,请自备茶水!???? 开门见山,咱不说废话! 你有没有想过,你写的程序,是如何在计算机中运行的吗?比如我们搞Java的,肯定写过这段代码 public class HelloWorld { public static void main(String[] args) { System.out.println("Hello World!"); } ...
【蘑菇街技术部年会】程序员与女神共舞,鼻血再次没止住。(文末内推)
蘑菇街技术部的年会,别开生面,一样全是美女。
Linux必懂知识大总结(补)
关机 1. 数据同步写入磁盘 sync 为了加快对磁盘上文件的读写速度,位于内存中的文件数据不会立即同步到磁盘上,因此关机之前需要先进行 sync 同步操作。 2. shutdown # /sbin/shutdown [-krhc] [时间] [警告讯息] -k : 不会关机,只是发送警告讯息,通知所有在线的用户 -r : 将系统的服务停掉后就重新启动 -h : 将系统的服务停掉后就...
那个在阿里养猪的工程师,5年了……
简介: 在阿里,走过1825天,没有趴下,依旧斗志满满,被称为“五年陈”。他们会被授予一枚戒指,过程就叫做“授戒仪式”。今天,咱们听听阿里的那些“五年陈”们的故事。 下一个五年,猪圈见! 我就是那个在养猪场里敲代码的工程师,一年多前我和20位工程师去了四川的猪场,出发前总架构师慷慨激昂的说:同学们,中国的养猪产业将因为我们而改变。但到了猪场,发现根本不是那么回事:要个WIFI,没有;...
为什么程序猿都不愿意去外包?
分享外包的组织架构,盈利模式,亲身经历,以及根据一些外包朋友的反馈,写了这篇文章 ,希望对正在找工作的老铁有所帮助
Java校招入职华为,半年后我跑路了
何来 我,一个双非本科弟弟,有幸在 19 届的秋招中得到前东家华为(以下简称 hw)的赏识,当时秋招签订就业协议,说是入了某 java bg,之后一系列组织架构调整原因等等让人无法理解的神操作,最终毕业前夕,被通知调往其他 bg 做嵌入式开发(纯 C 语言)。 由于已至于校招末尾,之前拿到的其他 offer 又无法再收回,一时感到无力回天,只得默默接受。 毕业后,直接入职开始了嵌入式苦旅,由于从未...
世界上有哪些代码量很少,但很牛逼很经典的算法或项目案例?
点击上方蓝字设为星标下面开始今天的学习~今天分享四个代码量很少,但很牛逼很经典的算法或项目案例。1、no code 项目地址:https://github.com/kelseyhight...
立即提问