使用 JavaScript 拆分 HTML 值

Split HTML value using JavaScript

本文关键字：HTML 拆分 JavaScript 使用      更新时间：2023-09-26
    // JavaScript Document   
    calc = function(prodNum) {
    var total = prices[0];
    Vstarterkit = (document.getElementById("starterkit").value);
T1 = (document.getElementById("doorswitch").value * prices[1]);
    T2 = (document.getElementById("passiveir").value * prices[2]);
T3 = (document.getElementById("vibration").value * prices[3]);
T4 =  (document.getElementById("keyfob").value * prices[4]);
T5 =  (document.getElementById("keypad").value * prices[5]);
T6 = (document.getElementById("communicator").value * prices[6]);
T7 = (document.getElementById("linebox").value * prices[7]);

    total += (document.getElementById("doorswitch").value * prices[1]);
total += (document.getElementById("passiveir").value * prices[2]);
total += (document.getElementById("vibration").value * prices[3]);
total += (document.getElementById("keyfob").value * prices[4]);
total += (document.getElementById("keypad").value * prices[5]);
total += (document.getElementById("communicator").value * prices[6]);
total += (document.getElementById("linebox").value * prices[7]);
    total += (document.getElementById("starterkit").value * 1);

  document.getElementById("Total_Cost").innerHTML = ""+total+".00";
  document.getElementById("Price_Vstarterkit").innerHTML = ""+Vstarterkit+".00";
  document.getElementById("Price_C1").innerHTML = ""+prices[1]+".00";
  document.getElementById("Price_C1").innerHTML = ""+prices[1]+".00";
  document.getElementById("Price_C2").innerHTML = ""+prices[2]+".00";
  document.getElementById("Price_C3").innerHTML = ""+prices[3]+".00";
  document.getElementById("Price_C4").innerHTML = ""+prices[4]+".00"; 
  document.getElementById("Price_C5").innerHTML = ""+prices[5]+".00";
  document.getElementById("Price_C6").innerHTML = ""+prices[6]+".00";
  document.getElementById("Price_C7").innerHTML = ""+prices[7]+".00";
  document.getElementById("Price_T1").innerHTML = ""+T1+".00";
  document.getElementById("Price_T2").innerHTML = ""+T2+".00";
  document.getElementById("Price_T3").innerHTML = ""+T3+".00";
  document.getElementById("Price_T4").innerHTML = ""+T4+".00";
  document.getElementById("Price_T5").innerHTML = ""+T5+".00";
  document.getElementById("Price_T6").innerHTML = ""+T6+".00";
  document.getElementById("Price_T7").innerHTML = ""+T7+".00";
}

目前，它从 html 中获取值，当选择项目时，将显示该选项的相应值

<option value="0" selected="selected">Select Starter Kit</option>
<option value="299|built in|4 x A|1 x B| 1 x C|1 x12V Battery">Starter Pack 1</option>
<option value="399|built in|5 x A|2 x B| 1 x C|1 x12V Battery">Starter Pack 2</option>
如果我分别只有 299 和 399，当我选择包

1 时，我返回值 299，或者选择包 2 我得到值 399

值 299|内置|4 x A|1 x B| 1 x C|1

x12V 电池 ，我想拆分，以便当我选择包 1 时得到，因为目前我返回"299|内置|4 x A|1 x B|1 x C|1 x12V 电池"

299
built in
4 x A
1 x B
1 x C
1 x12V Battery

我可以将这些值重新调用到我的 html 文档中，所以我需要使用 JavaScript 和分隔符进行拆分 |

然后，这些将被召回为该值的子值，但是在查看了几种可能性之后，我不知道该怎么做。 谁能指导我正确的方向。

很酷，但搜索术语非常混乱，因为那里有很多复杂的东西，我需要它很简单。 所以将这些行添加到我的 Java 中：-

var split = (document.getElementById("starterkit").value).split('|'); // splits my html value staterkit into splits[0] etc at each |
document.getElementById("Price_Vstarterkit").innerHTML = ""+split[0]+".00"; // returns values according to the html id 
document.getElementById("Value1_Vstarterkit").innerHTML = split[1];
document.getElementById("Vaule2_Vstarterkit").innerHTML = split[2]; and so on, thanks this works.

感谢大家的帮助。

相关文章：