在元素上单击和拖动

Javascript to click and drag over elements

本文关键字:拖动 单击 元素      更新时间:2023-09-26

我正在使用phantomjs在网站上抓取和爬行,我来到一个页面,为了在一天中为日历中的事件预订时间段,我必须点击,按住鼠标按钮并将鼠标移动到我想在事件期间占用的所有时间段。天是一个表行,槽位于具有随机生成的id的表列中,如下所示;

<tr class="day" id="monday">
    <td class="slot" id="randomly-generated-id">Morning</td>
    <td class="slot" id="randomly-generated-id">Lunch</td>
    <td class="slot" id="randomly-generated-id">Afternoon</td>
    <td class="slot" id="randomly-generated-id">Night</td>
</tr>

我想为活动预订一整天,在正常的图形浏览器中,这是通过单击最早的插槽并将鼠标拖动到您想为该特定活动预订的每个插槽来完成的。如何在javascript中触发这样的命令?jQuery也可以。

我分叉了另一个人的解决方案,并对其进行了调整,以适应您的需求,但只能让这个例子与表(tr td)以外的任何东西一起工作,检查它在这里:

http://jsfiddle.net/dcantato/fzkgLq6h/

这完成了你想要的,我个人更喜欢使用div而不是table。如果您重新编写自己的函数,您将希望从中吸取的主要内容是

window.getSelection();

document.selection.createRange();

在这段写得很好的代码中有一些更复杂的事情,但是从这些构建块中你可以重写它。