JS给隐藏input赋值并监听值变化

前言：

　　onchange触发是需要要获得焦点，然后再失去焦点后才会触发，如果JS修改input的value，并不会触发onchange事件。

　　从网上找到一种方法，记录下：

　　

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>JS赋值隐藏input并监听值变化</title>
</head>
<body>
  <button id="btn">给 input 赋值</button>
  <input type="hidden" id="input">
  <script src="./jquery-1.11.3.min.js"></script>
  <script>
    var a = 0;
    $("#btn").on('click', function() {
      $('#input').val(++a)
    })
    var inputObj = document.getElementById('input')
    Object.defineProperty(inputObj, 'value', {
      set: function(v) {
        // 监听到input值改变。。
        console.log(v) 
        return v
      }
    })
  </script>
</body>
</html>

版权声明：本文为CSDN博主「丨Anna丨」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/u014331138/article/details/123039991

posted @ 2022-04-21 10:03  vlson  阅读(620)  评论(0)  编辑  收藏  举报