推荐关注
› Meteor
› JSLint - a JavaScript code quality tool
› jsFiddle
› D3.js
› WebStorm
推荐书目
› JavaScript 权威指南第 5 版
› Closure: The Definitive Guide
› Closure: The Definitive Guide
请教一个 js 问题，为什么这个 input 会在鼠标滑走后里面的值立即消失了，我想给 input 强行输入内容
gelilaohuang · 2023-11-27 15:30:11 +08:00 · 1630 次点击这是一个创建于 396 天前的主题，其中的信息可能已经有所发展或是发生改变。
用在油猴脚本里，我试了很多网页的 input 都可以直接通过.value 去赋值，但遇到一个字节的后台就是赋不进去，请大触指点
$(document).on('mouseenter', "input[placeholder='Enter ID']", function () {
let ele = $(this).get()
tEvent(ele, "click");
tEvent(ele, "input");
ele.value = 123456789;
tEvent(ele, "keyup");
tEvent(ele, "change");
// tEvent(ele, "blur");
})
function tEvent (e, evType) {
if (e) {
window.newhtmlevents = window.newhtmlevents || document.createEvent("HTMLEvents");
newhtmlevents.initEvent(evType, true, true);
return e.dispatchEvent(newhtmlevents)
}
}
 |
1
shuxhan 2023-11-27 15:51:33 +08:00
下面报错，改成这样可以正常运行
if (e) { $(e).trigger(evType); } |
 |
2
gelilaohuang OP |
|
3
shuxhan 2023-11-27 16:24:50 +08:00
@gelilaohuang 我没理解，点击的时候赋值 value 进去了，然后你又写了一个鼠标悬浮事件是赋值 vlaue
现在没搞明白你的 mouseenter 是做什么用的，可以加我私聊现在有点闲 emlzaHVtZQ== |
 |
4
chingyat 2023-11-27 16:43:54 +08:00 via iPhone
react 的受控组件也可以这么操作吗？
|
 |
5
corcre 2023-11-27 16:46:09 +08:00
是不是控件数据不是在 dom 里面而是另外定义的变量去记录的, 然后 hover 的时候按照内存里面的数据把 dom 刷新了, 不然这里看不到有什么动作会触发清空这个操作
|
|
6
chingyat 2023-11-27 16:51:19 +08:00 via iPhone
这个网页是用 react 写的吗？
|
|
7
gelilaohuang OP @chingyat 盲猜是的，或者有没有搞 tiktok 商家后台的同学来说一下你们这个要在前台怎么赋值
|
|
8
gelilaohuang OP @corcre 尝试清掉 table 、tr 的所有事件，仍然无果放弃😄
|
|
9
chingyat 2023-11-27 17:08:26 +08:00
|
 |
10
lisxour 2023-11-27 17:17:22 +08:00
很明显这个 input 双向绑定了
|
|
11
gelilaohuang OP @chingyat 谢谢，我一会儿尝试下看看结果再来反馈
|
 |
12
Doctorwu 2023-11-27 17:37:16 +08:00
看上去是鼠标放上去触发 re-render 了, 然后 Input 的值被清除回了内存中保存的变量
|
 |
13
wangtian2020 2023-11-27 18:08:25 +08:00
试试看把完整流程都写进脚本里：聚焦输入框、输入值、取消聚焦
|
|
14
gelilaohuang OP ```
function setNativeValue (element, value) { // Get the original value setter of the element let nativeInputValueSetter = Object.getOwnPropertyDescriptor(window.HTMLInputElement.prototype, "value").set; // Set the new value using the native setter nativeInputValueSetter.call(element, value); // Create a new input event with the target element and bubbles flag let event = new Event("input", { target: element, bubbles: true }); // Add a simulated flag to the event for React 15 compatibility event.simulated = true; // Dispatch the event to the element element.dispatchEvent(event); } ``` 用这个搞定了，感谢大家的关注 |
 |
15
realJamespond 2023-11-28 10:49:15 +08:00
绑定的模拟输入吧，触发 onchange 事件赋值
|
Select Language