开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

在Web应用程序(或一般)中指示"可拖动性"的最佳方式？

在Web应用程序中指示"可拖动性"的最佳方式是使用HTML5的拖放API。这个API允许用户在页面上拖动元素，并将它们放到其他位置。以下是实现拖放功能的一些关键步骤：

在HTML元素上添加draggable="true"属性，以允许将其拖动。
使用dragstart事件监听器来处理拖动开始时的事件。
使用dragover事件监听器来处理拖动元素在目标元素上移动时的事件。
使用drop事件监听器来处理将拖动元素放到目标位置时的事件。

以下是一个简单的示例：

<!DOCTYPE html>
<html>
<head><style>
  .dragging {
    opacity: 0.5;
  }
  .dropped {
    background-color: yellow;
  }
</style>
</head>
<body>

<div id="div1" ondrop="drop(event)" ondragover="allowDrop(event)"></div>
<img id="drag1" src="image.jpg" draggable="true" ondragstart="drag(event)" width="336" height="69"><script>
function allowDrop(ev) {
  ev.preventDefault();
}

function drag(ev) {
  ev.dataTransfer.setData("text", ev.target.id);
  ev.target.classList.add("dragging");
}

function drop(ev) {
  ev.preventDefault();
  var data = ev.dataTransfer.getData("text");
  ev.target.appendChild(document.getElementById(data));
  ev.target.classList.add("dropped");
}
</script>

</body>
</html>

在这个示例中，我们有一个可拖动的图像（<img>元素）和一个可以放置图像的<div>元素。当用户将图像拖动到<div>元素上时，它会变成黄色，并将图像放入其中。

拖放API是一个强大的功能，可以帮助用户创建更直观、易用的Web应用程序。但是，请注意，某些浏览器可能不支持拖放API，因此在实现时需要考虑兼容性。

相关搜索:.net核心web应用程序可重用性的最佳实践 IIS或IIS中的ColdFusion 的Web文件安全性最佳实践可空类型:在c#中检查null或0的最佳方法在Android中列出图像或特定文件的最佳方式在AsyncStorage或redux中存储全局数据的最佳方式？在JavaScript中初始化html元素以实现可重用性的最佳方式？在python中存储变量或凭据的最佳方式是什么？在redux-saga应用中实现加载指示器的最佳方式是什么？在static react应用程序中传递图像的最佳方式在web应用程序上存储上传文档的最佳方式

相关搜索:

页面内容是否对你有帮助？

有帮助

没帮助

相关·内容

Spring Security 之防漏洞攻击

了解CSRF攻击的最好方式是通过一个具体的例子。假设您的银行网站提供了一个转账页面，允许从当前的登录用户向另一个账户转账，转账单可能如下： Example 1. 转账表单

02

如何使用浏览器工具调试PWA

本教程说明了Chrome和Firefox的开发工具展示了什么样的工具，用于帮助用户调试PWA。

04

程序狗必备：5个功能丰富的交互式Javascript库

在javascript的帮助下，可以为几乎每个领域(如移动、桌面应用程序和游戏Web开发)创建Web应用程序，因为该编程语言用作服务器端编程语言以实现最大功能，所以它是一种很好的编程语言。

01

安全测试 —— 你了解WEB安全测试吗？

之前在知乎上回答了一个朋友的提问，是关于安全测试相关面试题的，在回答之余让我也不禁想起了自己还在做软测执行的日子。趁着兴起，和团队里的安全测试小伙伴交流了一下，写下了这篇文章，也希望能帮助到更多正在安全测试道路上前行的小伙伴。

04

Web应用程序开发指南

Web应用程序是与服务器端编程相结合的动态Web站点，它提供诸如与用户交互，连接到后端数据库以及向浏览器生成结果等功能。

02

「网络安全」Web防火墙和下一代防火墙的区别

客户经常询问“当我已经拥有下一代防火墙（NGFW）时，为什么需要Web应用程序防火墙（WAF）？”。本博文的目的是解释两种解决方案之间的区别，重点关注Web应用程序防火墙可以提供的附加值。

01

浏览器事件

常用浏览器事件与DOM事件，包括鼠标事件、键盘事件、框架/对象事件、表单事件、剪贴板事件、打印事件、拖动事件、多媒体事件、动画事件、过渡事件。

02

登录工程：传统 Web 应用中的身份验证技术｜洞见

标题中的 “传统Web应用” 这一说法并没有什么官方定义，只是为了与“现代化Web应用”做比较而自拟的一个概念。所谓“现代化Web应用”指的是那些基于分布式架构思想设计的，面向多个端提供稳定可靠的高可用服务，并且在需要时能够横向扩展的Web应用。相对而言，传统Web应用则主要是直接面向PC用户的Web应用程序，采用单体架构较多，也可能在内部采用SOA的分布式运算技术。一直以来，传统Web应用为构成互联网发挥了重要作用。因此传统Web应用中的身份验证技术经过几代的发展，已经解决了不少实际问题，并最终

05

高薪必备的一些Spring Boot高级面试题

随着Spring社区的壮大，Spring慢慢变得越来越复杂，不再像开始宣称的那么轻量级。开发应用程序的配置量越来越大令开发者头疼。这时Spring Boot就派上用场了 - 它采用“约定大于配置”的思想简化了配置，对Spring提供的功能和配置而且将一些功能抽象成为“Starter”开箱即用、按需引用。极大地简化了开发。

01

高效快速地加载 AngularJS 视图｜TW洞见

今日洞见文章作者、部分图片来自ThoughtWorks：陈计节。本文所有内容，包括文字、图片和音视频资料，版权均属ThoughtWorks公司所有，任何媒体、网站或个人未经本网协议授权不得转载、链接、转贴或以其他方式复制发布/发表。已经本网协议授权的媒体、网站，在使用时必须注明"内容来源：ThoughtWorks洞见"，并指定原文链接，违者本网将依法追究责任。当AngularJS应用程序变大时，很多问题就开始显现出来了，比如多层级视图的加载问题。如果在子视图显示之前没有预加载，则可能在需要展示时发生视

07

Identity Server4学习系列一

今天开始学习Identity Server4,顺便了解下.Net Core,以便于完善技术栈,最主要的是要跟上.Net的发展潮流,顺便帮助各位整理下官方文档,加上一些我自己对他的理解.

03

Sentry 监控 - Dashboards 数据可视化大屏

Dashboard 允许您浏览跨多个项目的错误和性能数据，从而为您提供应用程序运行状况的广泛概览。Dashboard 由一个或多个小部件(widget)组成，每个小部件可视化一个或多个 Discover 查询。

01

七大Web应用程序安全最佳实践

2020年，CVE Details的数据显示，平均每天发现50个新的漏洞。因此，采取防护措施保护Web应用程序对企业安全的至关重要。本文将探索七种最佳实践给予Web应用程序最安全的保护。

03

渐进式Web应用程序的深入概述

如果您是Web开发人员，您可能已经了解渐进式Web应用程序（PWA）或已经实现了自己的应用程序。如果您不熟悉，本文将深入概述渐进式Web应用程序的实现原理，以及它们在现代Web开发中的重要程度。

02

[安全科普]你必须了解的session的本质

有一点我们必须承认，大多数web应用程序都离不开session的使用。这篇文章将会结合php以及http协议来分析如何建立一个安全的会话管理机制。我们先简单的了解一些http的知识，从而理解该协议的无状态特性。然后，学习一些关于cookie的基本操作。最后，我会一步步阐述如何使用一些简单，高效的方法来提高你的php应用程序的安全性以及稳定行。我想大多数的php初级程序员一定会认为php默认的session机制的安全性似乎是有一定保障的，事实恰好相反 – php团队只是提供了一套便捷的session的解

07

Asp.NetCore Web开发之初始文件解析

在写代码之前，有必要了解一下.net帮我们生成的文件都是干什么用的，在开发过程中他们都负责那些地方（下面以MVC模板举例）。

03

ssrf漏洞

利用条件（1）web服务器存在SSRF漏洞；（2）web服务器有访问本地或远程服务器的权限；存在位置一般是web服务器提供了从其他服务器获取数据的功能。（1）通过URL分享网页内容（2）在线翻译（3）通过url对图片的加载和下载（4）转码服务利用实验，开启方法

01

【最新】iPhone X 交互设计官方指南

昨天凌晨，苹果公司发布了带刘海的 iPhone X，这需要 iOS 开发者针对其屏幕做新的适配，会后苹果公司发布了 iPhone X 的适配指南，下面是翻译稿，供大家参考。

02

浏览器中存储访问令牌的最佳实践

浏览器提供了各种持久化数据的解决方案。当存储令牌时，您应该权衡存储选择与安全风险。

01

深入了解 Spring Boot 核心特性、注解和 Bean 作用域

Spring Boot 是基于 Spring Framework 构建应用程序的框架，Spring Framework 是一个广泛使用的用于构建基于 Java 的企业应用程序的开源框架。Spring Boot 旨在使创建独立的、生产级别的 Spring 应用程序变得容易，您可以"只是运行"这些应用程序。

00

Spring Boot最常见面试题

Spring Boot一直是Spring生态系统的关键参与者。该项目通过其自动配置功能使我们的生活更加轻松。在本教程中，我们将介绍在求职面试中可能出现的一些与Spring Boot相关的最常见问题。

03

Web应用服务分类综合知识详绪

描述:Web服务器/Web应用程序容器/Web应用程序服务器/反向代理有点像四胞胎，在网络上经常一起出现下面我们将对其进行区别;

02

翻译|前端开发人员的10个安全提示

Web安全是前端开发人员经常忽略的主题。当我们评估网站的质量时，我们通常会查看性能，SEO友好性和可访问性等指标，而网站抵御恶意攻击的能力却常常被忽略。

07

分享12款最佳的Bootstrap设计工具

设计师总会渴望有一些新奇有趣的设计工具来提高工作效率，而Bootstrap就是您的不二选择。2013年Bootstrap得到了广泛普及，它是开发者较为常用的框架之一，本文我们将分享12款最佳的Boo

08

众多Python Web框架比较，哪个适合你，你就用哪个！

Python程序员有很多很好的选择来创建Web应用程序和API；Django，Weppy，Bottle和Flask引领潮流。

02

htm5新特性

article元素，表示页面中的一块与上下文不相关的独立内容，比如博客中的一篇文章。

02

聊一聊前端面临的安全威胁与解决对策

前端安全是指用于保护您的网络应用程序/网站客户端免受威胁和漏洞的技术或实践。防止未经授权的访问、数据泄漏和恶意活动对您的网络应用程序整体完整性的影响非常重要。您的前端可能会受到多种攻击，例如跨站点脚本（XSS），它会将恶意脚本注入您的网络应用程序，以针对其用户。还有其他前端威胁，例如跨站点请求伪造、点击劫持等等。如果没有适当的措施，您的网络应用程序将容易受到大多数这些威胁的攻击。让我们深入探讨！

03

【大牛经验】Java开源web框架汇总（152款）

“框架”犹如滔滔江水连绵不绝，知道有它就好，先掌握自己工作和主流的框架；在研究好用和新框架。主流框架教程分享在Java帮帮-免费资源网其他教程需要时间制作，会陆续分享！！！ 152款框架，你还知道其他的吗？留言你用过的web框架 Java开源web框架汇总 1 Struts2 Struts2是一个web应用框架。它不是一个Struts的新的发布版本，而是一个全新的框架。Struts2 是第二代基于Model-View-Controller (MVC)模型的web应用框架。 Struts2是java

05

JavaScript调试和优化，深入研究谷歌Chrome浏览器开发工具（二）

您可以使用console.time(label)和console.timeEnd(label)来度量代码执行所需的时间。让我们在我们的简单示例中计算updateStock()方法的执行时间:

04

asp.net core IdentityServer4 概述

通常，每一层（前端，中间层和后端）都必须保护资源并实施身份验证和/或授权-经常针对同一用户存储。

02

「首席架构师看无服务器」openwhisk 经典使用案例

OpenWhisk提供的执行模型支持各种用例。以下各节包括典型示例。有关无服务器体系结构，示例用例，优缺点讨论和实现最佳实践的更详细讨论，请阅读Martin Fowler博客上的Mike Roberts优秀文章。

01

REST API和SOAP API之间的区别

The Representational State Transfer (REST)架构风格不是可以购买的技术，也不是可以添加到软件开发项目中的库。REST是一种世界观，将信息提升为我们构建的体系结构的第一流元素。

02

REST API和SOAP API之间的区别

The Representational State Transfer (REST)架构风格不是可以购买的技术，也不是可以添加到软件开发项目中的库。REST是一种世界观，将信息提升为我们构建的体系结构的第一流元素。

01

项目打成Jar包和War包的介绍与区别

如果一个Web应用程序的目录和文件非常多，那么将这个Web应用程序部署到另一台机器上，就不是很方便了，这时可以将Web应用程序打包成Web 归档(WAR)文件，这个过程和把Java类文件打包成JAR文件的过程类似。利用WAR文件，可以把Servlet类文件和相关的资源集中在一起进行发布。在这个过程中，Web应用程序就不是按照目录层次结构来进行部署了，而是把WAR文件作为部署单元来使用。

02

2020年将改变Web开发的顶级技术

Web改进包括每个站点工程师应考虑的巨大规则和程序。在过去的某个时候，HTML5，CSS3，JavaScript，PHP和MySQL被用作构建站点或Web应用程序的基本Web改进。无论如何，在最近几年中，随着一些新的Web改进，工具，结构和方言的兴起，现在它已经非常努力地尝试着选择要关注的内容（和要跳过的内容）。

01

如何选择合适的自动化测试工具？

自动化测试是高质量软件交付领域中最重要的实践之一。在今天的敏捷开发方法中，几乎任一软件开发过程都需要在开发阶段的某个时候进行自动化测试，以加速回归测试的工作。自动化测试工具可以帮助测试人员以及整个团队专注于自动化工具无法处理的各自任务，但困难的部分就是选择自动化工具。事实上，测试人员最常见的问题就是，如何选择适宜的自动化测试工具？

02

java war包是什么_jar包和war包区别是什么？

JAR(Java Archive，Java 归档文件)是与平台无关的文件格式，它允许将许多文件组合成一个压缩文件。JavaSE程序可以打包成Jar包(J其实可以理解为Java了)。

01

使用lazyInit缩短Spring Boot启动时间

Spring Boot可以进行有助于相关针对项目的设置，包括最常见的默认设置和随时可用的配置，这无疑是很棒的，因为它节省了宝贵的时间然而，对于框架的新手来说，可能不熟悉这些配置。你可能知道@SpringBootApplication本身并没有做任何事情。它默认组合三个注释@Configuration，@EnableAutoConfiguration和@ComponentScan，但是，并不是每个人都知道@ComponentScan注释有一个特别有用的属性: lazyInit。 LazyInit是一个布尔标志，指示容器在启动时或第一次访问容器时是否应该立即地创建所有发现的bean。默认情况下，该标志设置为false，这在生产中很好，但在本地计算机上开发应用程序时不一定。我们想要实现的是仅在本地开发环境中启用bean延迟加载，并在生产环境实现立即初始化加载。

jar包和war包区别及理解

在开发阶段不适合使用war包，因为在开发阶段，经常需要添加或删除Web应用程序的内容，更新 Servlet类文件，而每一次改动后，重新建立war包将是一件浪费时间的事情。在产品发布阶段，使用war文件比较合适的，因为在这个时候，几乎不需要再做什么改动了。

03

Nginx概念和机制

本文会从Nginx内部结构——非阻塞式，以及进程结构角度分析，并与阻塞-多进程结构对比，探究为何Nginx性能如此突出。

02

您如何使用Selenium来计算自动化测试的投资回报率？

跨浏览器测试是一种测试，需要大量的精力和时间。通过不同的浏览器，操作系统，设备，屏幕分辨率测试Web应用程序，以评估针对各种受众的Web内容呈现的过程是一项活动。特别是如果手动处理。使用Selenium进行的自动跨浏览器测试可以帮助您节省例行测试活动的时间，并帮助您缩短回归测试的时间。但是，人们很少喜欢变化。如果手动测试在您的组织中很流行，那么当您要求他们实施测试自动化时，管理层显然会提出问题。

01

Java 中文官方教程 2022 版（十二）

一个 Java 小程序可以将消息写入标准输出和标准错误流。在调试 Java 小程序时，将诊断信息写入标准输出可以是一个非常有价值的工具。

00

一文了解如何有效的防护DDoS攻击

想象一下有人使用不同的电话号码一遍又一遍地打电话给你，而你也无法将他们列入黑名单。最终你可能会选择关闭手机，从而避免骚扰。这个场景就是常见的分布式拒绝服务（DDoS）攻击的样子。

02

UI自动化测试最佳实践（一）

我们知道，在过去二十年UI端的自动化测试一直是我们项目上做自动化测试的重点。随着敏捷的发展，慢慢的越来越多人开始诟病UI自动化测试，觉得在UI端做自动化其稳定性和可靠性都比较差。

03

10个比较流行的PHP框架

PHP，或超文本预处理程序，是一种开源的服务器端脚本语言。它也非常受欢迎——截至2018年10月，几乎80%的网站都在使用PHP。

01

【云计算技术】Salesforce 5大性能问题

Salesforce是SaaS市场上的重量级公司，而Salesforce的问题可能会影响到成千上万的用户。Salesforce有一个在线状态指示板，许多用户利用它来监视应用程序，并确定它是否正常工作并按照预期执行。不过，trust.salesforce.com实际上只是一个Salesforce内部的仪表板，这样你就可以检查Salesforce基础设施和数据中心的所有功能是否正常。它并没有真正显示Salesforce 90%的交付路径上发生了什么。认为它是Salesforce的“检查引擎灯”:它告诉你引擎(应用程序代码)是否运行良好,但它并没有告诉你道路的状况(互联网),是否有道路建设(有限的带宽),或其他车辆占用交通(对资源的竞争)。仅仅因为“引擎”运行良好，并不意味着你能开得很快，很快到达目的地。

01

nginx配置参数详解，及其调优

Nginx是一款高性能、轻量级的Web服务器和反向代理服务器，它具有非常灵活的配置选项和高级调优功能，可以为Web应用程序提供卓越的性能和可靠性。在本文中，我们将深入探讨Nginx的配置参数和调优方法。

03

漏洞评估指南 {Vulnerability Assessment}

漏洞评估的四步指南这是一个建议的四步法，使用任何自动或手动工具启动有效的漏洞评估流程。

02

了解一下Spring Security吧

Spring Security是Spring框架中的一个强大且广泛使用的模块，专注于为Java应用提供全面的安全性支持。无论是Web应用、REST服务还是基于Spring的其他类型应用，Spring Security都能够提供灵活、可定制的身份验证和授权机制。本文将深入探讨Spring Security的关键概念、使用方法和一些最佳实践，以帮助开发人员构建安全可靠的Java应用。

01

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭