如何在Javascript中逐行读取输入框并根据输入返回各种值？答案

【问题标题】：How to read input box line by line in Javascript and return various values depending on input?如何在Javascript中逐行读取输入框并根据输入返回各种值？
【发布时间】：2022-01-16 10:34:52
【问题描述】：

我正在尝试在 Javascript 中创建一个函数，它可以逐行读取输入框并根据输入返回不同的值。

例如，如果有人以 Arg86Lys 格式在不同的行中输入多个蛋白质突变，我希望该函数读取前三个和后三个字母以获取 Arg Lys。然后，如果我为 Arg Lys 存储了一个值（比如说 100），我希望输出是一个文本框，它打印出值 100（并在单独的行上打印出其余的值）。

我被困在如何逐行读取输入框值，并且只提取每行的前三个和最后三个字母。我也不明白如何存储值（如 Arg Lys = 100）并在找到某个输入时返回所述值。

到目前为止，我已经创建了一个多行文本框（在 HTML 中）并尝试创建一个逐行读取的函数：

<body>
      <form action = "/cgi-bin/hello_get.cgi" method = "get">
         Enter mutations on separate lines with format Arg86Lys
         <br>
         <textarea rows = "5" cols = "60" name = "description">
         </textarea><br>
         <input type = "submit" value = "submit" />
      </form>
      <script>
         var lines = document.getElementById('textareaId').innerHTML.split('\n');
for(var i = 0;i < lines.length;i++){
   \\
}
      </script>
   </body>

【问题讨论】：

使用.value，而不是.innerHTML。此外，您的脚本会在页面加载时立即运行，而不是在提交表单时运行。

标签： javascript html function return-value

【解决方案1】：

textarea 是一个输入，因此它的值将存储在其 value 属性中，并与表单提交一起传递。这是我找到的关于如何拦截表单的提交事件的答案：

Intercept a form submit in JavaScript and prevent normal submission

一旦你拦截了表单提交事件，从description 输入中提取值，然后从那里做你想做的事情

【讨论】：

【解决方案2】：

let form = document.getElementById("form");
let data = {"Arg Lys":100}; // store data like this
form.addEventListener("submit",function(e){
e.preventDefault();
var lines = document.getElementById('textareaId').value.split('\n');
document.getElementById('textareaId').value = '';
    for(var i = 0;i < lines.length;i++){
   let val = lines[i].substring(0,3);
   let lastval = lines[i].substring(lines[i].length - 3)
   document.getElementById('textareaId').value += val+' '+lastval + ' - ' +data[val+' '+lastval]+'\n';
}
})

<body>
      <form id="form" action = "/cgi-bin/hello_get.cgi" method = "get">
         Enter mutations on separate lines with format Arg86Lys
         <br>
         <textarea id="textareaId" rows = "5" cols = "60" name = "description"></textarea><br>
         <input type = "submit" value = "submit" />
      </form>
   </body>

您是否正在寻找类似的东西？

【讨论】：

没错！另一个问题：我如何存储额外的数据？会不会是这样的： let data = {"Arg Lys":100}; {“阿拉列乌”：135}； {“Trp Tyr”：150}；？格式是什么？非常感谢
将所有数据存储在一个数组中 LIKE : let data = {"Arg Lys":100,"Ala Leu":135,"Trp Tyr":150}