问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
开发者社区
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

input的值动态改变的时怎么实时监听？

头像
Twisted
    4421494156
    <!DOCTYPE html>
<html>
<head>
    <script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js"></script>
    <title>测试</title>
</head>
<body>
    <input class="et-name" type="input" name="name" id="main">

    <script type="text/javascript">
        $(function () {
            $(".et-name").bind("input propertychange", function () {
                console.log($(".et-name").val());
            });
        });

        setTimeout(() => {
            document.getElementById('main').value = 'dgskagkdsa'
        }, 3000);
    </script>
</body>
</html>

    延迟对input赋值，我想在赋值后就可以监听到这个值的变化。

    onchange oninput onpropertychange都不行。

    求各位大佬帮忙

    javascript
    阅读 3.4k
    4 个回答
    得票最新
    头像
    一缕青丝断情愁
      19016

      方式一：

      通过onkeydown|onkeyup：当按下|松开 按键时触发，来获取值的更新。
      <input class="test-input" onkeyup="keyUp()" onkeydown="keyDown()">

function keyUp(){
 const value = document.getElementByClassName("test-input")[0].value
 // do something
}

function keyDown(){
 const value = document.getElementByClassName("test-input")[0].value
 // do something
}

      方式二：

      通过事件监听来获取输入框的值的变化
      <input class="test">

$('.test').addEventListener('input',function(){
 let value = $('test').value()
 console.log(`值更新了${value}`)
})
      头像
      vizo
        41922837

        试试这个, 不行再找我

        $('body').on('input', '.et-name', function() {
  console.log( $(this).val() )
})
        头像
        名字
          30112448

          你可以试下把赋值语句改成这样

          setTimeout(() => {
    $("#main").val("dgskagkdsa").trigger('input');
}, 3000);
          头像
          雾岛听风
            12.1k51358
            $("#etName").change(function () {
  console.log($("#etName").val());
  setTimeout(() => {
    document.getElementById("etName").value = "dgskagkdsa";
  }, 3000);
});

            change、focus、blur、keyup、keydown这些都可以的

            撰写回答
            你尚未登录，登录后可以
            • 和开发者交流问题的细节
            • 关注并接收问题和回答的更新提醒
            • 参与内容的编辑和改进，让解决方法与时俱进
            推荐问题