python 基于selenium实现鼠标拖拽功能


Posted in Python onDecember 24, 2020

1、准备html文件

首先我们需要准备一个鼠标滑动的html文件,用来演示鼠标滑动的效果,注意需要将我们的html文件放在自己的服务器上,

这样我们才能够通过selenium来进行验证。html文件如下:

<html>
<head>
  <meta charset="utf-8" />
  <style>
    body {
  margin: 0;
  padding: 0;
}

input{
  appearance:none;
  -moz-appearance:none;
  -webkit-appearance:none;
  background: none;
  border:none;
}

.wrap{
  margin: 200px 0 0 200px;
}

.box {
  position: relative;
  width: 200px;
  height: 30px;
  border-radius: 20px;
  background: #686B69;
  line-height: 30px;
  overflow: hidden;
  margin-bottom: 40px;
  color: #fff;
  font-size: 12px;
}

.btn {
  position: absolute;
  top: 0;
  left: 0;
  height: 30px;
  width: 30px;
  background: #0c7;
  border-radius: 20px;
  text-align: center;
}

.tips {
  text-align: center;
}

#submit{
  line-height: 28px;
  border-radius: 3px;
  background: #0c7;
  width: 200px;
  text-align: center;
  color: #fff;
}
  </style>
</head>
<body>
<div class="wrap">
<div class="box">


<div class="btn" id="dragEle"></div>


<div class="tips">>>拖动滑块验证<<</div>

</div>
 <input type="button" value="提交验证" id="submit" />
</div>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
  function DragValidate (dargEle,msgEle){
    var dragging = false;//滑块拖动标识
    var iX;
    dargEle.mousedown(function(e) {
      msgEle.text("");
      dragging = true;
      iX = e.clientX; //获取初始坐标
    });
    $(document).mousemove(function(e) {
      if (dragging) {
        var e = e || window.event;
        var oX = e.clientX - iX;
        if(oX < 30){
          return false;
        };
        if(oX >= 210){//容器宽度+10
          oX = 200;
          return false;
        };
        dargEle.width(oX + "px");
        //console.log(oX);
        return false;
      };
    });
    $(document).mouseup(function(e) {
      var width = dargEle.width();
      if(width < 200){
        //console.log(width);
        dargEle.width("30px");
        msgEle.text(">>拖动滑块验证<<");
      }else{
        dargEle.attr("validate","true").text("验证成功!").unbind("mousedown");
      };
      dragging = false;
    });
  };

  DragValidate($("#dragEle"),$(".tips"));
  $("#submit").click(function(){
    if(!$("#dragEle").attr("validate")){
      alert("请先拖动滑块验证!");
    }else{
      alert("验证成功!");
    }
  });
</script>
</body>
</html>

2、使用selenium进行鼠标拖拽操作,具体代码如下:

from selenium import webdriver
import unittest
from selenium.webdriver import ActionChains
import time
 
 
url = 'http://192.168.62.9:1234/easytest/tt'
driver = webdriver.Chrome(executable_path="C:\chromedriver.exe")
driver.get(url)
driver.maximize_window()
 # 获取第一,二,三能拖拽的元素
drag1 = driver.find_element_by_id('dragEle')
 
# 创建一个新的ActionChains,将webdriver实例对driver作为参数值传入,然后通过WenDriver实例执行用户动作
action_chains = ActionChains(driver)
# 将页面上的第一个能被拖拽的元素拖拽到第二个元素位置
# 将页面上的第三个能拖拽的元素,向右下拖动10个像素,共拖动5次
action_chains.drag_and_drop_by_offset(drag1, 208, 0).perform()
time.sleep(5)
driver.quit()

以上就是python 基于selenium实现鼠标拖拽功能的详细内容,更多关于python 鼠标拖拽的资料请关注三水点靠木其它相关文章!

Python 相关文章推荐
Python 获取新浪微博的最新公共微博实例分享
Jul 03 Python
python实现爬虫下载美女图片
Jul 14 Python
Python实现读取文件最后n行的方法
Feb 23 Python
python实现简易版计算器
Jun 22 Python
python机器学习之KNN分类算法
Aug 29 Python
django解决跨域请求的问题详解
Jan 20 Python
详解Python学习之安装pandas
Apr 16 Python
postman模拟访问具有Session的post请求方法
Jul 15 Python
Python调用graphviz绘制结构化图形网络示例
Nov 22 Python
python3.x中安装web.py步骤方法
Jun 23 Python
pycharm中leetcode插件使用图文详解
Dec 07 Python
tensorboard 可视化之localhost:6006不显示的解决方案
May 22 Python
python实现简单猜单词游戏
Dec 24 #Python
Python 虚拟环境工作原理解析
Dec 24 #Python
python基于openpyxl生成excel文件
Dec 23 #Python
Python+unittest+requests+excel实现接口自动化测试框架
Dec 23 #Python
用python计算文件的MD5值
Dec 23 #Python
python中lower函数实现方法及用法讲解
Dec 23 #Python
Python类型转换的魔术方法详解
Dec 23 #Python
You might like
些很实用且必用的小脚本代码
2006/06/26 Javascript
jQuery的一些特性和用法整理小结
2010/01/13 Javascript
JavaScript中使用正则匹配多条,且获取每条中的分组数据
2010/11/30 Javascript
2012年开发人员的16款新鲜的jquery插件体验分享
2012/12/28 Javascript
Jquery 复选框取值兼容FF和IE8(测试有效)
2013/10/29 Javascript
一个简单的实现下拉框多选的插件可移植性比较好
2014/05/05 Javascript
escape编码与unescape解码汉字出现乱码的解决方法
2014/07/02 Javascript
jQuery实现不断闪烁文字的方法
2015/05/15 Javascript
jQuery实用技巧必备(中)
2015/11/03 Javascript
jQuery抛物线运动实现方法(附完整demo源码下载)
2016/01/08 Javascript
jQuery原理系列-css选择器的简单实现
2016/06/07 Javascript
javascript将中国数字格式转换成欧式数字格式的简单实例
2016/08/02 Javascript
JS+Canvas实现的俄罗斯方块游戏完整实例
2016/12/12 Javascript
js实现做通讯录的索引滑动显示效果和滑动显示锚点效果
2017/02/18 Javascript
jQuery插件FusionCharts绘制ScrollColumn2D图效果示例【附demo源码下载】
2017/03/22 jQuery
js实现简易聊天对话框
2017/08/17 Javascript
javascript获取指定区间范围随机数的方法
2017/09/08 Javascript
ES6 系列之 Generator 的自动执行的方法示例
2018/10/19 Javascript
JSON字符串操作移除空串更改key/value的介绍
2019/01/05 Javascript
详解小程序之简单登录注册表单验证
2019/05/13 Javascript
vue select 获取value和lable操作
2020/08/28 Javascript
[04:48]DOTA2上海特锦赛小组赛第三日 TOP10精彩集锦
2016/02/28 DOTA
[04:40]2016个国际邀请赛中国区预选赛场地——华西村观战指南
2016/06/25 DOTA
python使用xslt提取网页数据的方法
2018/02/23 Python
python实现AES加密解密
2019/03/28 Python
Pyinstaller 打包发布经验总结
2020/06/02 Python
Python内置方法和属性应用:反射和单例(推荐)
2020/06/19 Python
python中time.ctime()实例用法
2021/02/03 Python
导出HTML5 Canvas图片并上传服务器功能
2019/08/16 HTML / CSS
La Senza官网:北美顶尖性感内衣品牌
2018/08/03 全球购物
如何从一个文件档案的尾端新增记录
2016/12/02 面试题
高中生学习总结的自我评价范文
2013/10/13 职场文书
社区志愿者心得体会
2014/01/03 职场文书
倡导文明标语
2014/06/16 职场文书
外国人来华邀请函
2015/01/31 职场文书
使用tensorflow 实现反向传播求导
2021/05/26 Python