模拟javascript中的点击(也位于窗口外部。)

时间:2018-11-26 09:45:14

标签: javascript html

我正在尝试动态模拟点击,我已经使用此功能对三个缩进的树进行了模拟:

document.onmousemove = function(e) {
        cursorX = e.pageX;
        cursorY = e.pageY;
}

function ret_vw(v) {
  var w = Math.max(document.documentElement.clientWidth, window.innerWidth || 0);
  return (v * w) / 100;
}

function simulateClick(x, y) {
    var s = d3.select(document.elementFromPoint(x, y));
    s.on("click")(s.datum());
}

function multiple_click() {
    //onmousemove = function(e){console.log("mouse location:", e.clientX, e.clientY)}
    if (cursorX >= ret_vw(15.25) && cursorX < ret_vw(42)) {
        simulateClick(cursorX + ret_vw(28) - window.pageXOffset, cursorY - window.pageYOffset);
        simulateClick(cursorX + ret_vw(56) - window.pageXOffset, cursorY - window.pageYOffset);
    }
    else if (cursorX >= ret_vw(43.25) && cursorX < ret_vw(70.25)) {
        simulateClick(cursorX - ret_vw(28) - window.pageXOffset, cursorY - window.pageYOffset);
        simulateClick(cursorX + ret_vw(28) - window.pageXOffset, cursorY - window.pageYOffset);
    }
    else if (cursorX >= ret_vw(71.25)) {
        simulateClick(cursorX - ret_vw(28) - window.pageXOffset, cursorY - window.pageYOffset);
        simulateClick(cursorX - ret_vw(56) - window.pageXOffset, cursorY - window.pageYOffset);
    }
    else
        console.log("no , cursorX = " + cursorX + " , cursorY = " + cursorY + " vw = " + ret_vw(15.25));
}

它适用于下面的情况,如果我单击一个,它将单击另外两个,确定为三个:

(不单击)

enter image description here

(单击)

enter image description here

但是我遇到两个问题,如果我将一个缩进的树之一推到窗口外,它将无法工作,其次,我需要动态地进行操作,因为我不会总是缩进3个(我可以像二,四,五棵树...)

这是我的函数multi_click无法使用(窗口外的树..)的情况下的图片:

enter image description here

感谢帮助人员!

(带有d3.js的已识别树的源:https://bl.ocks.org/mbostock/1093025

1 个答案:

答案 0 :(得分:1)

我建议不要使用鼠标事件来触发点击-最终会调用此点击功能:

function click(d) {
  if (d.children) {
    d._children = d.children;
    d.children = null;
  } else {
    d.children = d._children;
    d._children = null;
  }
  update(d);
}

您将创建一个新的mouseClick函数,该函数将替换当前在单击鼠标时发生的函数。 这将为所有匹配项调用当前的点击功能。这是概念:

function mouseClick(d) {
  // Assuming you have multiple roots (example only has root)

  for (root in roots) {
      // Find d in the current root (by name?)
      matching_d = ...  

      click(matching_d)
  }
}