我不太了解JS，我是这个世界的新手，我对HTML和CSS有所了解但是这次我被要求做一个应用程序，我必须从纯文本接收数据使用JS我的处方集。
这是我的纯文本data.txt：
Interfaces: test1,
IP: 192.168.1.1,
Mask : test,
Gateway : test,
DNS 1: test,
DNS 2: test,
Broadcast: test
这是我的Div：
<div class="col-md-12">
<div class="form-panel">
<h4><i class="fa fa-angle-right"></i> Formulario </h4>
<hr />
<form method="post">
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">Interfaces:</label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group ">
<label class="col-sm-3 col-sm-3 control-label">IP: </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">Mask : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label"> Gateway : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">DNS 1 : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">DNS 2 : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">Broadcast : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<br><br>
<div class="form-group">
<button type="submit" name="Save" class="btn btn-success btn-sm" " title="Save"><i class="fa fa-save"></i> Save</button>
</div>
</form>
</div>
这是我从你们那里得到的剧本，因为我一直在寻找能够做到这一点的代码，而这正是我得到的。
关键是包含＆＃34; data.tx＆＃34;的数据。应该在我的处方集上，如果我在那里修改任何字段，我会点击＆＃34; save＆＃34;按钮它也必须在我的纯文本上写。
有没有办法让它发挥作用？谢谢！
完整的代码如下。
var mytext;
var connection = new XMLHttpRequest();
connection.open('GET', '/data.txt');
connection.onreadystatechange = function() {
mytext=connection.responseText;
}
connection.send();<div class="col-md-12">
<div class="form-panel">
<h4><i class="fa fa-angle-right"></i> Formulario </h4>
<hr />
<form method="post">
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">Interfaces:</label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group ">
<label class="col-sm-3 col-sm-3 control-label">IP: </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">Mask : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label"> Gateway : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">DNS 1 : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">DNS 2 : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<div class="form-group">
<label class="col-sm-3 col-sm-3 control-label">Broadcast : </label>
<div class="col-sm-9">
<input type="text" class="form-control"
</div>
</div>
<br><br>
<div class="form-group">
<button type="submit" name="Save" class="btn btn-success btn-sm" " title="Save"><i class="fa fa-save"></i> Save</button>
</div>
</form>
</div>
</div>
答案 0 :(得分：0)
我不知道我存在一个更有效的解决方案，但是下面的代码正在运行。
以下是我使用jQuery .load()
$(document).ready(function(){
// Load the file in an hidden div element.
$("#hiddenFileLoad").load("data.txt", function(){
// Callback executes when content is loaded
// Place the content in a var
var loadedText = $("#hiddenFileLoad").text();
console.log("loadedText:\n\n"+loadedText);
// Split into an array
var loadedTextSplitted = loadedText.split(",");
// Remove the label part for each
for (i=0;i<loadedTextSplitted.length;i++){
temp = loadedTextSplitted[i].split(": ");
loadedTextSplitted[i] = temp[1];
}
// Place each info in the HTML form
$(".form-panel").find("input").each(function(index){
$(this).val( loadedTextSplitted[index] );
});
}); // End of .load callback
});
我使用并隐藏了div，以便加载.txt文件内容，我给了“hiddenFileLoad”id。
我对您的HTML完全没有任何更改（隐藏的div添加除外），我使用了您的txt文件内容。
我假设您知道如何保存到文件... 我没有让保存按钮起作用。
Here is a live example在我的服务器上。