javascript - 鼠标悬停在鼠标上后如何自动按按钮

我正在使用Visual Studio CodeReactJavaScriptHTML构建更大的应用程序。 我正在使用第三方路由器登录我建造的小型机器人。 该机器人将使用由combobox和相关button触发的继电器打开,该button将应用combobox选择。 我也是JavaScriptHTML新手,因此我学会了如何部署网站,并准备了一个最小的可验证示例 ,可以在这里https://comboboxtest.netlify.com/找到,您还可以在这里获取源代码如果需要的话。

启动Visual Studio之后,该应用程序的目标将是:

1)在路由器内部登录,

2)自动触发组合框

3)使用“ Apply按钮自动应用组合框选择。

为了更好地显示此内容,请参见下面的打印屏幕:

布局

问题 :为了访问路由器,有一个我没有写的外部接口,因为它来自路由器。 我在界面中导航,并到达了HTML按钮中的“ Apply按钮,如下所示:

导航

因此,操作如下:

1)我使用组合框触发继电器

2)使用鼠标我必须将鼠标悬停在“ Apply按钮上

3)将鼠标放在按钮上(鼠标悬停后),我可以单击并应用选择

4)选择应通过声明确认为绿色。

什么不起作用:我可以触发组合框,但不能自动悬停并单击“应用”按钮。

下面是我正在使用的代码最重要的部分:

property string get_relay_comboBox: "
      var comboBox = document.getElementsByName('859-2-2')[0];
      // find a target element.
      if (comboBox) {
        // Add event listener for combobox
        comboBox.addEventListener('change', function (e) {
          console.log('Change event detected:', e);
        });
        // Get new option index by flipping the current selected index
        var newIdx = (comboBox.selectedIndex + 1) % 2;
        // set the new index
        comboBox.selectedIndex = newIdx;
        // fire change event
        comboBox.dispatchEvent(new Event('change'));
      }
      else {
        console.error('comboBox not found!');
      }
    ";

property string applyBtn: "
    function fun('btnb btnhov') {
      document.getElementById('btn_Apply').click();
    }
";

到目前为止我尝试过的

1)我研究了一段时间,发现了这个问题以及以下有助于理解如何触发组合框的帖子

2)我右键单击“ Apply按钮上的路由器界面,然后打开“ Inspect Element菜单,然后转到“ Show DOM properties我发现下面的截图可能会有用:

显示DOM属性

3) 这是我过去了解HTML部分的内容,实际上,我了解组件的调用方式很重要,但仍无法弄清楚如何使用按钮接受对组合框的选择。

4)遵循此来源(这是调用单击事件的基本方式之后,我简单地应用了它,因为可能在下面显示它:

    function fun('btnb btnhov') {
      document.getElementById('btn_Apply').click();
    }

但是我没有工作,我认为这时所解释的最重要的问题将是如何检测出停顿事件, 然后按按钮。 怎么做?

编辑

我还尝试通过以下方式重写该函数:

property string applyBtn: "
    var btnApply = document.getElementById('btn_Apply');
    if(btnApply) {
        // Try add event listener for button
        btnApply.addEventListener('change', function(e) {
            console.log('Change event detected:', e);
        });
      // Push button
      // Here the button should be pushed (or hovered first????)
    }
    else {
        console.error('btnApply not found!');
    }
";

感谢任何可以指导解决此问题的正确方向的人。

转载请注明来自askonline.tech,本文标题:javascript - 鼠标悬停在鼠标上后如何自动按按钮


 Top