我会给你完整的故事。我刚刚创建了一个新的Web服务器(这是我的新手!)
我编写了一个python脚本,该脚本将折扣代码(经常更改)输出到Web服务器本身上的.txt文件。
我所需要的只是获取该.txt文件的内容并将其添加到我的页面<input value="HERE">
中,这样我可以使用一个按钮为用户复制内容。
我一直在寻找Javascript,但想知道我是在客户端还是在错误的地方
我尝试嵌入文本文件,尽管该值显示在页面上,但我仍在努力将其复制到剪贴板。我似乎在输入框上钉上了复制功能,因此只要有值就可以了。
这是我到目前为止的工作,实际上需要“复制”作为从.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>
谢谢
答案 0 :(得分:1)
据我所知,您有两个选择:
一个正在使用fetch
(如果在网站上使用,则使用jQuery的ajax
):
fetch("/file.txt")
.then(response => response.text())
.then(text => document.getElementById("input2").textContent = text);
您拥有的另一种选择是在后端读取文件并将其作为数据传输到前端,这取决于您后端所使用的框架,语言和服务器,但是您没有在问题中指定任何文件。
此选项可能会更好,因为它需要较少的请求,这会提高性能,但这取决于您需要的内容-如果您希望动态呈现文件而不是将文件从页面中的服务器中插入,就可以了。 。但是您确实需要考虑要使用哪一个以及为什么。
了解详情:
答案 1 :(得分:0)
这是我使用jQuery的方法:
$.ajax({
url: "file.txt",
dataType: "text",
success: function (data) {
$("#input2").value(data);
}
});
这将提取file.txt
的内容,如果可以找到文件,则将数据放入ID为value
的元素的input2
属性中。