什么是错误的这个表单自动填充javascript

What is wrong with this form autofill javascript?

本文关键字:填充 javascript 表单 错误 什么      更新时间:2023-09-26

从浏览器调用,应该展开名称为7725的"select"菜单,然后1秒后选择data-id为18726的菜单选项。

菜单像被点击一样展开,但我无法让它选择该选项。

var element = document.getElementsByName("7725")[0];
var element2 = document.querySelectorAll('[data-id="18726"]')[0];
var dispatchMouseEvent = function(target, var_args) {
  var e = document.createEvent("MouseEvents");
  e.initMouseEvent.apply(e, Array.prototype.slice.call(arguments, 1));
  target.dispatchEvent(e);
};
dispatchMouseEvent(element, 'mouseover', true, true);
dispatchMouseEvent(element, 'mousedown', true, true);
dispatchMouseEvent(element, 'click', true, true);
dispatchMouseEvent(element, 'mouseup', true, true);
var func = function () {
dispatchMouseEvent(element2, 'mouseover', true, true);
dispatchMouseEvent(element2, 'mousedown', true, true);
dispatchMouseEvent(element2, 'click', true, true);
dispatchMouseEvent(element2, 'mouseup', true, true);}
setTimeout(func, 1000);
html

<select data-widget-cid="widget-1" class="ui-dropdown ui-dropdown-system" data-role="content" name="7725">
<option data-role="item" value="" data-id="">--Please select--</option>
<option data-role="item" value="100018726-IE 1" data-id="18726">IE 1</option>
<option data-role="item" value="100018727-IE 2" data-id="18727">IE 2</option>
<option data-role="item" value="100018728-IE 3" data-id="18728">IE 3</option>
<option data-role="item" value="100018729-IE 4" data-id="18729">IE 4</option>
</select>

下面是自动选择data-id为18726的选项的纯JavaScript版本

var getIndexOf = function (id) {
    var options = document.getElementsByTagName('option');
    for (var i = 0; i < options.length; i++) {
        if (id == options[i].getAttribute('data-id')) {
            return i;
        }
    }
};
var el = document.getElementsByTagName('select')[0];
el.selectedIndex = getIndexOf('18726');