Javascript 确认框中数据显示方式的问题

我有一个带有多个文本框的表单，我可以在其中键入材料名称，并在另一个框中键入材料价格

当用户单击提交时，我将显示一个确认框，其中包含输入的材料和价格。在这个确认框中，我想显示所有输入的物料名称和相关的物料价格（每行一个）。我似乎无法使其按我所希望的方式显示，下面的脚本输出如下：

材料名称
材料价格
材料名称
材料价格
等等

我希望它显示如下：
物料名称：物料价格
物料名称：物料价格
物料名称：物料价格
等等

所有我得到的是下面的脚本，它给了我正确的输出，只是没有显示，因为我希望它在确认框

脚本

var matr_name = $("input[name*='matr']").map(function() {
return $(this).val()}).get().join('\n');
var confirm_form = confirm("Rep:\n" + matr_name);
console.log("Mart.: " + matr_name);
if(confirm_form == true)
  {
return true;
  } 
else {
return false;
      }
    }

表单的一部分：

    <tr>
            <td><input type="text" name="matr_name[]" id="matr_name" ></td>
            <td><input type="text" name="matr_price[]" id="matr_price"/></td>
        </tr>
        <tr>
            <td><input type="text" name="matr_name[]" id="matr_name" ></td>
            <td><input type="text" name="matr_price[]" id="matr_price"/></td>
        </tr>
        <tr>
            <td><input type="text" name="matr_name[]" id="matr_name" ></td>
            <td><input type="text" name="matr_price[]" id="matr_price"/></td>
        </tr>
        <tr>
            <td><input type="text" name="matr_name[]" id="matr_name" ></td>
            <td><input type="text" name="matr_price[]" id="matr_price"/></td>
        </tr>
<input type="submit" name="submit_name" id="submit_id" class="submit" value="Done" onclick="javascript:return show_confirm();"/>

---

您可以根据名称在值后放置不同的字符串：

var matr_name = $("input[name*='matr']").map(function() {
  return $(this).val() + ($(this).attr('name') == 'matr_name[]' ? ': ' : '\n');
}).get().join('');

或：

---

不要对同一页面中的多个项目使用同一id，这是非法的。。。谢谢@AndreaLigios，我将使用类。或者使用带有数字标识符的ID，比如matr_name_1，matr_name_2，等等。你想在这里使用CSS。。。你试过了吗？。。。知道了。除此之外，你对如何解决我的问题有什么建议吗？对于刚接触JS的人来说，这很难：）@Sandepnayak:是的，你说得有道理。它并不比已经存在的代码更难，但我猜它最初主要是从某个地方复制的。我添加了一个更可读的版本@Sandepnayak是的，但在我将

.attr（'name'）

更改为

.attr（'id'）

后，它完全符合我的要求。现在，我只需要仔细研究一下代码的具体功能。@Nomis：是的，我错过了名称中的括号。您可以将它们添加到您比较的值中。你真的应该删除那些重复的id，它们不能正常工作（或者至少避免使用它们）。。。。谢谢@Guffa会做的，注册。id为“我将使用类”。

var matr_name = $("input[name*='matr']").map(function() {
  if ($(this).attr('name') == 'matr_name[]') {
    return $(this).val() + ': ';
  } else {
    return $(this).val() + '\n';
  }
}).get().join('');