javascript - Js中如何将输入的text-value转换为对象的属性值？

Question

我将输入的文本值转换为 inp1 var，但是一旦我想在 obj 中调用它，它就不起作用了。

<input type="text" placeholder="Enter your text here" class="input fade-in" id="inp1" required>

 var inp1 = document.getElementById("inp1").value;

$(function(){
  $('#qrcode').qrcode({
    width: 150,
    height: 150,
    text: "https://www.stackoverflow.com/" + inp1
  });
});

我希望二维码显示url + 输入的文本

Answer 1

您的代码在页面加载时运行一次。那时，输入字段还是空的。相反，您可能希望每当输入发生变化 时更新二维码。为此你需要一个事件监听器:

 $(function(){
   var input = $("#inp1"); // if you use jQuery, use it everywhere. Also retrieve the element when the document loaded

   input.on("change", function() { // listen for input changes
     $('#qrcode').qrcode({ // then update the qr code
       width: 150,
       height: 150,
       text: "https://www.stackoverflow.com/" + input.val(),
     });
   });
 });

您可能需要考虑使用 input event instead of the change event取决于您的用例。