在文本框中拆分值，并将值添加到表

Question

This是我的示例html5

我需要将product 文本框 B Relief 750 MG | 710中的值拆分为两部分（此处|是分隔符）并将拆分的值添加到相应的列中在我的表中

当我点击B Relief 750 MG按钮

时，

product会在710列和Price中添加到Add

function add_values() {
  var $sd = document.getElementById("product").value;

  if ($sd !== '') {

    var table = document.getElementById("tblProduct");
    var rowCount = table.rows.length;
    var row = table.insertRow(rowCount);

    var cell1 = row.insertCell(0);
    var element1 = document.createElement("input");
    element1.type = "checkbox";
    element1.name = "chkbox[]";
    cell1.appendChild(element1);

    var cell2 = row.insertCell(1);
    cell2.innerHTML = rowCount;

    var cell3 = row.insertCell(2);
    var element2 = document.createElement("input");
    element2.type = "text";
    element2.name = "txtbox[]";
    cell3.appendChild(element2);
    cell3.innerHTML = document.getElementById("product").value;

    var cell4 = row.insertCell(3);
    var element2 = document.createElement("input");
    element2.type = "text";
    element2.name = "txtbox[]";
    cell4.appendChild(element2);
    cell4.innerHTML = document.getElementById("qty").value;

    document.getElementById("product").value = '';
    document.getElementById("qty").value = '';
  }


};

function deleteRow() {
  try {
    var table = document.getElementById("tblProduct");
    var rowCount = table.rows.length;

    for (var i = 0; i < rowCount; i++) {
      var row = table.rows[i];
      var chkbox = row.cells[0].childNodes[0];
      if (null != chkbox && true == chkbox.checked) {
        table.deleteRow(i);
        rowCount--;
        i--;
      }


    }
  } catch (e) {
    alert(e);
  }
}

table {
  width: 100%;
  border-collapse: collapse;
}
/* Zebra striping */

tr:nth-of-type(odd) {
  background: #eee;
}
th {
  background: #333;
  color: white;
  font-weight: normal;
}
td,
th {
  padding: 6px;
  border: 1px solid #ccc;
  text-align: left;
}

<table id="tblProduct" class="display">
  <thead>
    <tr>
      <th>Select</th>
      <th>Sl.No</th>
      <th>Product(s)</th>
      <th>QTY</th>
      <th>Price</th>
    </tr>
  </thead>
</table>

<p>
  <input type="text" name="product" id="product" placeholder="Type Product's Name " value="B Relief 750 MG | 710">
  <ul id="productsuggestions" data-role="listview" data-inset="true"></ul>
  <br>
  <input type="number" name="qty" id="qty" placeholder="Type Product's Qty " value="10">
</p>

<div>
  <div id="buttonsAddDelete">
    <div class="inner">
      <input type="button" name="add" id="add" value="Add" onclick="add_values()">
    </div>
    <div class="inner">
      <input type="button" name="delete" id="delete" value="Delete" onclick="deleteRow()">
    </div>
  </div>
</div>

Answer 1

在javascript中使用'split'功能。

  

split（）方法用于将字符串拆分为数组   子串，并返回新数组。

您可以使用

var data = $sd.split('|');

现在，data[0]将包含字符串“B Relief 750 MG”，data[1]将包含字符串“710”

请参阅fiddle

Answer 2

＆＃13;

＆＃13;

var splited = $('#product').val().split('|');
console.log(splited[0]);
"B Relief 750 MG "
console.log(splited[1]);
" 710"

＆＃13;

＆＃13;

＆＃13;