javascript - 将 .txt 文件中的文本拉入 <input> 值 HTML

标签 javascript html

我会给你完整的故事。我刚刚创建了一个新的网络服务器(我对这一切都很陌生!)

我编写了一个 python 脚本,可以将折扣代码(经常更改)输出到 Web 服务器本身上的 .txt 文件。

我只需要获取该 .txt 文件的内容并将其添加到我的页面 <input value="HERE">所以我可以有一个按钮来为用户复制内容。

我一直在寻找 Javascript,但想知道我是不是找错地方了,因为它是客户端。

我已尝试嵌入文本文件,尽管该值显示在页面上,但我很难将其复制到剪贴板。我似乎将复制功能固定在输入框上,因此我需要的就是其中的值。

这是我目前所拥有的,实际上需要“TO BE COPIED”作为从我的 .txt 文件中提取的值:

function myFunction() {
    var copyText = document.getElementById("input2");
    copyText.select();
    document.execCommand("copy");
}
.btn {
    border: none;
    background-color: inherit;
    padding: 14px 28px;
    font-size: 16px;
    cursor: pointer;
    display: inline-block;
}

.btn:hover {background: #eee;}

.success {color: green;}
<html>
    <head>
      <meta name="viewport" content="width=device-width, initial-scale=1">
    </head>    
    <body>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

      <button type="button" value="COPY BUTTON" onclick="myFunction()">COPY BUTTON</button>
      <input type="text" value="TO BE COPIED" id="input2">
      <form>
        <input type="button" class="btn success" value="Go to Google" onclick="window.location.href='https://www.google.com'" />
      </form>

      <script src="test.js"></script>
    
    </body>
</html>

谢谢

最佳答案

据我所知,您有两个选择:

一个是使用 fetch(如果您在网站上使用 jQuery 的 ajax):

fetch("/file.txt")
    .then(response => response.text())
    .then(text => document.getElementById("input2").textContent = text);

您的另一个选择是在后端读取文件并将其作为数据传输到前端,这取决于您的后端使用的框架、语言和服务器,但您没有在问题中指定任何这些。

这个选项可能会更好,因为它需要更少的请求,这对性能更好,但这取决于您需要它的目的 - 如果您更愿意动态呈现文件而不是从页面中的服务器插入它,那很好.但是您确实需要考虑要使用哪一个以及为什么。

阅读更多:

关于javascript - 将 .txt 文件中的文本拉入 &lt;input&gt; 值 HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51944351/

相关文章:

javascript - 在 jQuery 中选择除 ... 之外的所有元素

javascript - 从 Leaflet map 中删除 geoJSON

javascript - 如何使用jquery抓取动态添加的输入框的输入值

如果重新加载页面,JavaScript 将忽略警报

javascript - 调用返回 JSON 的操作方法时,Ajax 和 getJSON 之间有什么区别

javascript - 如何将上传的 pdf 文件传递​​给变量。 (PDF.JS)

javascript - 尽管使用 .on(),动态创建的元素不会触发事件

php - 表格数据格式化(来自数据库的数据)

从 Javascript 字符串调用时 PHP 逻辑不运行

javascript - 通过 JavaScript 将 style.property 设置为文本区域