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使用htpasswd实现基本认证授权的例子
Jun 10 Python
Python里隐藏的“禅”
Jun 16 Python
python3实现UDP协议的服务器和客户端
Jun 14 Python
Django Admin 实现外键过滤的方法
Sep 29 Python
Python栈算法的实现与简单应用示例
Nov 01 Python
Python selenium抓取微博内容的示例代码
May 17 Python
Django 模型类(models.py)的定义详解
Jul 19 Python
Python文件操作方法详解
Feb 09 Python
python-xpath获取html文档的部分内容
Mar 06 Python
Window10上Tensorflow的安装(CPU和GPU版本)
Dec 15 Python
python 日志模块logging的使用场景及示例
Jan 04 Python
写一个Python脚本下载哔哩哔哩舞蹈区的所有视频
May 31 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
php中文乱码怎么办如何让浏览器自动识别utf-8
2014/01/15 PHP
php实现搜索一维数组元素并删除二维数组对应元素的方法
2015/07/06 PHP
PHP执行SQL文件并将SQL文件导入到数据库
2015/09/17 PHP
JavaScript 全面解析各种浏览器网页中的JS 执行顺序
2009/02/17 Javascript
js返回上一页并刷新代码整理
2012/12/21 Javascript
jquery ajax实现下拉框三级无刷新联动,且保存保持选中值状态
2013/10/29 Javascript
JS(JQuery)操作Array的相关方法介绍
2014/02/11 Javascript
实现js保留小数点后N位的代码
2014/11/13 Javascript
jQuery中的jQuery()方法用法分析
2014/12/27 Javascript
JavaScript中的操作符==与===介绍
2014/12/31 Javascript
jQuery动态效果显示人物结构关系图的方法
2015/05/07 Javascript
悬浮广告方法日常收集整理
2016/03/18 Javascript
Ionic默认的Tabs模板使用实例
2016/08/29 Javascript
Agularjs妙用双向数据绑定实现手风琴效果
2017/05/26 Javascript
jQuery实现input[type=file]多图预览上传删除等功能
2019/08/02 jQuery
H5实现手机拍照和选择上传功能
2019/12/18 Javascript
JS表格的动态操作完整示例
2020/01/13 Javascript
[01:03:38]2014 DOTA2国际邀请赛中国区预选赛5.21 CNB VS CIS
2014/05/22 DOTA
[03:59]5分钟带你了解什么是DOTA2(第二期)
2017/02/07 DOTA
从Python的源码浅要剖析Python的内存管理
2015/04/16 Python
Python编程实现的图片识别功能示例
2017/08/03 Python
Python3转换html到pdf的不同解决方案
2019/03/11 Python
python3.6环境安装+pip环境配置教程图文详解
2019/06/20 Python
Python 获取指定文件夹下的目录和文件的实现
2019/08/30 Python
Python新手如何进行闭包时绑定变量操作
2020/05/29 Python
日本航空官方网站:JAL
2019/06/19 全球购物
自我鉴定的范文
2013/10/03 职场文书
医院检讨书范文
2014/02/01 职场文书
万能检讨书
2015/01/27 职场文书
工作能力自我评价2015
2015/03/05 职场文书
办公室年度工作总结2015
2015/05/21 职场文书
2016年端午节红领巾广播稿
2015/12/18 职场文书
煤矿安全学习心得体会
2016/01/18 职场文书
竞选稿之小学班干部
2019/10/31 职场文书
vue+spring boot实现校验码功能
2021/05/27 Vue.js
解决springboot druid数据库连接失败后一直重连的方法
2022/04/19 Java/Android