Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
202 views
in Technique[技术] by (71.8m points)

控制台使用js更新input值无效

猜测是类似双向绑定的原因,那么这种情况如何使用控制台来更新 input 的值呢?

随着 web 前端发展, MVVM 框架的流行, 很多页面想要实现自动赋值不再向以前那样对输入框简单的赋值即可, 还需要对应的触发相关的事件让对应框架去取值才行.
http://fengyitong.name/index.php/archives/38/

上面的方法也无效 = =!


以 B 站高级弹幕举例:
在控制台使用 $(xxx).val('xxx') 或者 document.querySelector().value=xxx 更新 input 的数值后,UI 可以正常显示,获取的也是更新后的值。但是测试效果依旧读取的旧值。
尝试手动调用各种 change、input、blur 等方法,都无效。

因为 B 站使用了 Vue 猜测跟双向绑定可能有关,但是不知道怎么通过控制台让它更新。。。。


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

手动触发也无效?触发方式不对吧。基于Vue,你现在是下面这样一个效果

image.png

手动触发 input 事件 document.querySelector('input').dispatchEvent(new CustomEvent('input', {}))

image.png


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...