0

我在互联网上的任何地方都找不到解决方案。我有一个带有可变“价格”的代码和一个包含在内的下拉列表。

下拉列表的值为 1-40。当价值改变时，总价格应该立即改变。如在同一行中，如在最终总价中。

enter code here



 function calc(){
  one = document.getElementById("price1").childNodes.item(1).childNodes.item(1).value;
  two = parseFloat(document.getElementById("price1").childNodes.item(5).textContent.replace("€",""))
  document.getElementById("price1").childNodes.item(9).textContent =  one * two;
}
<tr id="price1">
        <td><?php include('optie.php');?></td>
        <td><strong>3-gangen traiteurmenu</strong><br>
            (incl. brood en boter)<br>******<br>
            Creme van gerookte paling<br>******<br>
            Gestoofde hertensukade met aardappelgratin, rodekool en een stoofpeertje.<br>******<br>
            Kerstbal van witte en pure chocolade en een vanillesaus.<br><hr>
            </td>
        <td><?php $prijs1= "16.50";?> &euro;<?php  echo $prijs1; ?></td>
        <td>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&euro;</td>
        <td id="Total"></td> 
    </tr>

我在上面添加了这段代码，这正确计算了第一个下拉菜单。但是现在，我必须能够做到这 13 次，所有的下拉菜单

我现在知道它必须用 java 来完成，因为那是一种动态语言。

提前致谢！

碧玉

在 option.php 下

porties <select>
        <option value="0">0</option>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
        <option value="4">4</option>
        <option value="5">5</option>
        <option value="6">6</option>
        <option value="7">7</option>
        <option value="8">8</option>
        <option value="9">9</option>
        <option value="10">10</option>
        <option value="11">11</option>
        <option value="12">12</option>
        <option value="13">13</option>
        <option value="14">14</option>
        <option value="15">15</option>
        <option value="16">16</option>
        <option value="17">17</option>
        <option value="18">18</option>
        <option value="19">19</option>
        <option value="20">20</option>
        <option value="21">21</option>
        <option value="22">22</option>
        <option value="23">23</option>
        <option value="24">24</option>
        <option value="25">25</option>
        <option value="26">26</option>
        <option value="27">27</option>
        <option value="28">28</option>
        <option value="29">29</option>
        <option value="30">30</option>
        <option value="31">31</option>
        <option value="32">32</option>
        <option value="33">33</option>
        <option value="34">34</option>
        <option value="35">35</option>
        <option value="36">36</option>
        <option value="37">37</option>
        <option value="38">38</option>
        <option value="39">39</option>
        <option value="40">40</option>                                            
    </select>
4

3 回答 3

2

PHP 是服务器端代码。

这意味着一旦您看到您的网站在浏览器中呈现，它已经从服务器交付，现在是“客户端”。PHP 无法运行客户端。

如果您右键单击并查看源代码，您将看到您的所有 PHP 代码已被 HTML 和纯文本替换。

所以你需要的是一种客户端编程语言，比如 Javascript。大多数人不再使用纯 JavaScript。这是因为不同的浏览器对 javascript 的解释不同。最流行的跨浏览器 JavaScript 库称为jquery。

下载 jquery，将其包含在您的网站中，方法是将此代码放在头部：

<script type="text/javascript" src="/path/to/jquery.js"></script>

现在您可以编写一些跨浏览器兼容的 javascript。

所以要做你想做的事，你需要在选择下拉菜单上检测“更改”事件。您可以使用change()jQuery 中的函数来执行此操作。

这是一个 jsfiddle 让你上路：http: //jsfiddle.net/GmC3K/

如果您对 jquery 有任何疑问，祝您好运！;)

于 2012-08-31T14:16:12.450 回答
1

您应该使用 Javascript 来实现这一点。

方法是将更改事件附加到下拉控件。因此，无论何时更改，都会更新显示价格的元素。

于 2012-08-31T14:15:27.167 回答
0 
    function calc(){
  a = document.getElementById("price1").childNodes.item(1).childNodes.item(1).value;
  aa = parseFloat(document.getElementById("price1").childNodes.item(5).textContent.replace("€",""))
  z = document.getElementById("price1").childNodes.item(9).textContent =  Math.round(a * aa *100)/100;

  b = document.getElementById("price2").childNodes.item(1).childNodes.item(1).value;
  bb = parseFloat(document.getElementById("price2").childNodes.item(5).textContent.replace("€",""))
  zz = document.getElementById("price2").childNodes.item(9).textContent =  Math.round(b * bb *100)/100;

  c = document.getElementById("price3").childNodes.item(1).childNodes.item(1).value;
  cc = parseFloat(document.getElementById("price3").childNodes.item(5).textContent.replace("€",""))
  zzz = document.getElementById("price3").childNodes.item(9).textContent =  Math.round(c * cc *100)/100;

  d = document.getElementById("price4").childNodes.item(1).childNodes.item(1).value;
  dd = parseFloat(document.getElementById("price4").childNodes.item(5).textContent.replace("€",""))
  zzzz = document.getElementById("price4").childNodes.item(9).textContent =  Math.round(d * dd *100)/100;

  e = document.getElementById("price5").childNodes.item(1).childNodes.item(1).value;
  ee = parseFloat(document.getElementById("price5").childNodes.item(5).textContent.replace("€",""))
  zzzzzzzzzzz=document.getElementById("price5").childNodes.item(9).textContent =  Math.round(e * ee * 100)/100;

  f = document.getElementById("price6").childNodes.item(1).childNodes.item(1).value;
  ff = parseFloat(document.getElementById("price6").childNodes.item(5).textContent.replace("€",""))
  zzzzz = document.getElementById("price6").childNodes.item(9).textContent =  Math.round(f * ff *100)/100;

  g = document.getElementById("price6").childNodes.item(1).childNodes.item(1).value;
  gg = parseFloat(document.getElementById("price6").childNodes.item(5).textContent.replace("€",""))
  zzzzzzzzzzzz=document.getElementById("price6").childNodes.item(9).textContent =  Math.round(g * gg *100)/100;


  h = document.getElementById("price7").childNodes.item(1).childNodes.item(1).value;
  hh = parseFloat(document.getElementById("price7").childNodes.item(5).textContent.replace("€",""))
  zzzzzz = document.getElementById("price7").childNodes.item(9).textContent =  Math.round(h * hh *100)/100;

  i = document.getElementById("price8").childNodes.item(1).childNodes.item(1).value;
  ii = parseFloat(document.getElementById("price8").childNodes.item(5).textContent.replace("€",""))
  zzzzzzz = document.getElementById("price8").childNodes.item(9).textContent =  Math.round(i * ii *100)/100;

  j = document.getElementById("price9").childNodes.item(1).childNodes.item(1).value;
  jj = parseFloat(document.getElementById("price9").childNodes.item(5).textContent.replace("€",""))
  zzzzzzzz = document.getElementById("price9").childNodes.item(9).textContent =  Math.round(j * jj *100)/100;

  k = document.getElementById("price10").childNodes.item(1).childNodes.item(1).value;
  kk = parseFloat(document.getElementById("price10").childNodes.item(5).textContent.replace("€",""))
  zzzzzzzzz = document.getElementById("price10").childNodes.item(9).textContent =  Math.round(k * kk *100)/100;

  l = document.getElementById("price11").childNodes.item(1).childNodes.item(1).value;
  ll = parseFloat(document.getElementById("price11").childNodes.item(5).textContent.replace("€",""))
  zzzzzzzzzz = document.getElementById("price11").childNodes.item(9).textContent =  Math.round(l * ll *100)/100;

  document.getElementById("total").childNodes.item(9).textContent =  Math.round((z + zz + zzz + zzzz + zzzzz + zzzzzz + zzzzzzz + zzzzzzzz + zzzzzzzzz + zzzzzzzzzz + zzzzzzzzzzz + zzzzzzzzzzzz )*100)/100;

}

也许不是最漂亮的代码，但它可以工作:)

于 2012-09-10T13:59:14.577 回答