Javascript 在输入更改时追加Img Src

我想制作一个表单，当用户在输入框中键入内容时，输入框会更改我的图像（这是一个API图像）的src结尾

因此，图像代码如下所示：

<img src="https://api.qrserver.com/v1/create-qr-code/?data=HelloWorld&size=100x100" />

我也尝试过：

var link = document.getElementById("baseUrl");
    link.href = "http://api.qrserver.com/v1/create-qr-code/?data="+document.getElementById('linktextbox')+"&size=100x100"

---

感谢您的帮助

这里是纯JavaScript中的代码

函数更新qr（ele）{
document.getElementById（“qr”）.src=”https://api.qrserver.com/v1/create-qr-code/?data=“+encodeURIComponent（ele.value）+”&size=100x100/”；
}

你可以这样做

显然，您需要一个输入和一些东西来确认用户操作，比如我添加的按钮

编辑：为了不滥用生成图像的服务器，我特意选择不使用keyUp事件

单击该按钮时，一小块Javascript将更新图像标记的src

我使用ID来标识HTML元素，但是有许多不同的方法来查找特定的元素

函数更新qr（）{
document.getElementById（'image'）.src=”https://api.qrserver.com/v1/create-qr-code/?data=“+encodeURIComponent（document.getElementById（'textInput'）.value）+”&size=100x100”；
}

更新二维码

也许你还需要发布你尝试的两种方法，展示你的尝试，以便我们了解你的尝试yourself@MasivuyeCokile我已经编辑了这个问题，您可能需要对textInput数据执行

encodeURIComponent（）

。

var link = document.getElementById("baseUrl");
    link.href = "http://api.qrserver.com/v1/create-qr-code/?data="+document.getElementById('linktextbox')+"&size=100x100"