这个表单自动填充javascript有啥问题？

Posted 2023-02-24

【中文标题】这个表单自动填充javascript有啥问题？

【英文标题】：What is wrong with this form autofill javascript?这个表单自动填充javascript有什么问题？

【发布时间】：2016-09-05 16:53:52

【问题描述】：

它是从浏览器调用的，应该展开名称为 7725 的“选择”菜单，然后在 1 秒后选择数据 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>

【问题讨论】：

能给一些html吗？

@SufianSaory 我用示例 html 更新了它，谢谢

有人吗？...... :(

当我在 chrome 中运行您的代码时，我收到以下警告“从 javascript 生成的 DOM 事件已触发浏览器内的默认操作。此行为是非标准的，将在 M53 中删除，大约2016 年 9 月。有关详细信息，请参阅 chromestatus.com/features/5718803933560832。”。也许是出于安全问题，它不允许。

如果是这样，我猜第一个菜单选择将不起作用，根据该页面，在版本 53 中默认情况下应该启用 dom 事件。似乎它可能是别的东西

【参考方案1】：

这是用于自动选择数据 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');