Javascript 无法使用append显示总计_Javascript

Javascript 无法使用append显示总计

javascript

Javascript 无法使用append显示总计,javascript,Javascript,我正在制作一个食品配送应用程序。我希望有一个地方可以显示总数。现在，我无法显示数量和价格相乘的总金额。它不会显示在应用程序上而且，控制台上也没有错误 Javascript代码： function _showorderResult(arr) { var value1 = arr[0].price; var value2 = arr[0].quantity; for (var i = 0; i < arr.length; i++) { result

我正在制作一个食品配送应用程序。我希望有一个地方可以显示总数。现在，我无法显示数量和价格相乘的总金额。它不会显示在应用程序上

而且，控制台上也没有错误

Javascript代码：

function _showorderResult(arr) {
    var value1 = arr[0].price;
    var value2 = arr[0].quantity;

    for (var i = 0; i < arr.length; i++) {

        result = value1 * value2;

        htmlstring = "";

        $("#itemimage").html("<img src='" + serverURL() + "/images/" +
            arr[i].imagefile + "' width='200'>");
        $("#price").html("Price" + ": " + " $" + arr[i].price);
        $("#itemname").html("Item" + ":" + arr[i].itemName);
        $("#quantity").html("Quanitiy" + ":" + arr[i].quantity);
        $("result").append(htmlstring);
        $("#requestedDateTime").html("To delivery by" + ":" + arr[i].requestedDateTime);
        $("#deliveredDateTime").html("Delivered on" + ":" + arr[i].deliveredDateTime)

    }
}

函数\u showorderResult（arr）{
var value1=arr[0]。价格；
var value2=arr[0]。数量；
对于（变量i=0；i


而且，控制台上也没有错误
我的控制台中有很多错误，但这里有几个错误。首先，您的代码不可运行。请考虑制作< < /P>
接下来，您误用了append（…）
函数，或者没有正确格式化该函数。这是为了附加HTML元素，而不是字符串值
如评论所示，您似乎混淆了var result
和$（“result”）
。如果不使用DOM选择器，则可能不希望jQuery包装变量。正确的jQuery包装语法应该是$（result）
，而不使用双引号，但也请不要这样做，它不会比var result
提供任何好处htmlstring
不包含任何实际的HTML，因此我将其重命名为runningTotal
，并将其添加到price*quantity
中。必须首先初始化，否则将得到NaN

确保初始化变量。到目前为止，有些硬编码索引，如value1=arr[0].price
，在粘贴的代码中没有意义。我们可以假设您在排除故障后将这些留在这里。下次请把它们清理干净
最后，这是次要的，但要与对象名称保持一致。。。e、 g.imagefile
与imagefile
的对比。你选择哪一个并不重要，只要你始终如一。这将有助于找到今后的打字错误
下面是一个工作示例：
<html>
<img src="" id="itemimage">
<p id="price">Price: $0.00</p>
<p id="itemname">Item: None</p>
<p id="quantity">Quantity: None</p>
<p id="result">Running: None</p>
<p id="requestedDateTime">To delivery by: None</p>
<p id="deliveredDateTime">Delivered on: None</p>

<script>
var order = [{
  price: 5,
  quantity: 3,
  itemName: 'Pizza',
  imagefile: 'pizza.png',
  requestedDateTime: '12:00',
  deliveredDateTime: '12:30'
}];

/** Dummy function to allow code to run **/
var serverURL = function() { return ""; }

function _showorderResult(arr) {
    // var value1 = arr[0].price;
    // var value2 = arr[0].quantity;
    var result;
    var runningTotal = 0;

    for (var i = 0; i < arr.length; i++) {

        result = arr[i].price * arr[i].quantity;

        runningTotal += result;

        $("#itemimage").html("<img src='" + serverURL() + "/images/" + arr[i].imagefile + "' width='200'>");
        $("#price").html("Price" + ": " + " $" + arr[i].price);
        $("#itemname").html("Item" + ":" + arr[i].itemName);
        $("#quantity").html("Quanitiy" + ":" + arr[i].quantity);
        $("#result").html("Running" + ":" + runningTotal);
        $("#requestedDateTime").html("To delivery by" + ":" + arr[i].requestedDateTime);
        $("#deliveredDateTime").html("Delivered on" + ":" + arr[i].deliveredDateTime);

    }
}

_showorderResult(order);
</script>
</html>


价格：0.00美元
项目：无
数量：无
正在运行：无
交付人：无
交付日期：无
变量顺序=[{
价格:5,，
数量：3，
项目名称：“比萨饼”，
图像文件：“pizza.png”，
请求日期时间：“12:00”，
交付日期时间：“12:30”
}];
/**允许代码运行的伪函数**/
var serverURL=function（）{return”“；}
函数\u showorderResult（arr）{
//var value1=arr[0]。价格；
//var value2=arr[0]。数量；
var结果；
var runningTotal=0；
对于（变量i=0；i
您希望htmlstring
包含什么内容？您将其设置为空字符串，然后对其不做任何其他操作。$（“结果”）
非常确定您要使用的选择器是错误的，还建议检查其他选择器是否正确