使用 HTML/JS 接受/触发图像键盘 (GIF)

Question

我们如何通过普通文本输入接受/触发图像键盘（如 Android 上的 GIF 键盘）？

HTML：

<input type="text">

当我尝试插入 gif 时，我得到

无法在此处输入此内容。

所以问题是我们如何触发用户插入一些 GIF 图像？

喜欢...

<input type="text" accept="..." oninput="...">

这个有可能？

资源： https : //developer.android.com/guide/topics/text/image-keyboard

Answer 1

对的，这是可能的。要获取图像，您需要使用<input type='file'>.

function displayImg() {
    var file = document.getElementById('file').files[0];
    //call the filereader
    var reader  = new FileReader();
    reader.onload = function(e)  {
        //create the img tag
        var image = document.createElement("img");
        //get the image
        image.src = e.target.result;
        //resize the image
        image.style.width = '100%';
        image.style.height = '100%';
        document.body.appendChild(image);
     }
     reader.readAsDataURL(file);
}

<body>
      <input type=file name=filename id=file>
     <button type=button onclick='displayImg()'>Display</button>
</body>