0

我正在做一个需要开发交互式菜单的学校项目。由于我已经学习了几个月,所以我对 JavaScript 和 html 的许多方面的知识有限。我正在制作一个统一的菜单,理论上允许用户购买统一的物品(我实际上并没有添加支付选项)。

我需要帮助才能创建一个函数或类似的东西,它会显示您所做的选择并延续您所做的选择,这将产生一条确认消息。

例如

在上面的屏幕截图中,假设用户想要 2 件小西装外套。因此,用户将单击小并单击输入数量并输入 2。然后用户将单击确认订单,这将显示一条确认消息,例如

You have chosen to confirm 2 small sized blazers for $400. Confirm?

问题是我不知道如何创建此消息,该消息因用户想要的大小和数量而异。

jsFiddle中的示例代码:对不起,如果这不太有意义。我已经尽力解释我的问题,所以我可能错过了重要的细节。所以如果我这样做了,请告诉我。

HTML:

    <td>Blazer (All Sizes) - $200</td>
    <td><button onclick="small()">Small</button> 
    <p><button onclick="medium()">Medium</button>  </p>
    <button onclick="large()">Large</button> </td>
    <td><button onclick="quantitynumber()">Enter Quantity</button> </td>
    <td><button onclick="confirmorder()">Confirm Order</button> 

JS:

var blz = 0  
function small()
  {
      blz = confirm ('You have selected size: Small. Confirm?')
  }
   function medium()
  {
      blz = confirm ('You have selected size: Medium. Confirm?')
  }
   function large()
  {
      blz = confirm ('You have selected size: Large. Confirm?')
  }

 function quantitynumber()
 {
     blz = prompt ('Enter the number of Blazer(s) to order')
     blz1 = blz * 200
        if ( blz == 1) {
    blz1 = confirm ('You have chosen to order 1 Blazer for $' + blz1 + '. Confirm?')
    }

            else if ( blz >=2  && blz <= 5) {
    blz1 = confirm ('You have chosen to order ' + blz + ' Blazers for $' + blz1 + '. Confirm?')         
    }

    else if (blz >5) {
        alert('There is a limit of 5 Blazers per customer.')
        blz = null
        blz1= null
    }
    else if (blz = isNaN || blz == '') {
        alert ('Please type in a valid number.')
    }

 }
function confirmorder()
{
    if (blz == small && blz >= 1 && blz <= 5) {
    blz1 = confirm ('You have chosen to confirm ' + blz + ' small sized Blazers for $' + blz1 + '. Confirm?')
    }

}
4

2 回答 2

1

因为您只有一组有限的值.. 3 种尺寸的西装外套.. 数量不能大于 5... 我认为.. 更好的解决方案是让用户从一组有限的选项中进行选择..

示例:在这里提琴

<table border="1" >
<tr>
<td>Blazer (All Sizes) - $200</td>
    <td>Size:
    <select id="blz_size" > 
        <option value="small"  >Small </option>
        <option value="medium"  >Medium </option>
        <option value="large"  >Large</option>
        </select>
    </td>
    <td>Quantity: 
     <select id="blz_quantity" > 
        <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>
        </select>
    </td>
    <td><input type="button" onclick="confirmorder()" value="Confirm Order" /> </td>
    </tr>
</table>

<script type="text/javascript" >
function confirmorder()
{
var blz_size = document.getElementById('blz_size').value;
var blz_quan = document.getElementById('blz_quantity').value;
    var total = blz_quan * 200 ;
var choice = confirm ('You have chosen to order ' + blz_quan + ' ' + blz_size + ' sized Blazers for $' + total + '. Confirm?' );

    if(choice) {
     // do whatever you have to here...  
      alert("Order Confirmed");
    }
    else {
     return false;   
    }

}
</script>
于 2013-10-20T04:44:54.420 回答
0

一个快速的解决方案是创建一个订单对象数组。您可以使用 array.push() 函数将您的订单推送到可变长度数组中。这将允许您跟踪多个订单,而无需事先了解任何内容。然后,您可以遍历所有订单并相应地制定您的信息。

function order(item,quan,price)
{
    this.item = item;
    this.quan = quan;
    this.price = price;
}

var orders = [];

orders.push(new order("shirt",50,200));

alert("You have chosen to confirm " + orders[0].quan + " " + orders[0].item + "(s) for " + orders[0].price + ". Confirm?");
于 2013-10-20T04:36:00.277 回答