jQuery Part 2

1. html 和 js 传值

html:

@(lang: String, shop: Shop, meal: Meal, table: DiningTable)

@layout("Dashboard", Seq("/assets/javascripts/operator-dashboard.min.js"), Seq("/assets/stylesheets/operator-dashboard.min.css")){
<script>
window.id = @meal.id;

</script>

注意 在html中传入的值需要加@取值，不能直接传对象并使用，例如meal，因为这时对象只是一个特定字符串，但是可以单独取元素使用.

 

javascript:

id = window.id

可以直接用window传递值

 

2. js 实时检测输入变化, 如下 输入subtotal discount, Total实时变化

Subtotal:

Discount:

Total: $0.00

displayInvoice = (subtotal, discount) ->

  discountAmount = subtotal*discount/100
  $('.display-discount').html "$" + discountAmount.toFixed(2)
  total = 0
  total = subtotal
  total -= discountAmount
  $('.display-total').html "$" + total.toFixed(2)

updateInfo=() ->
  subtotal = parseFloat($('#subtotal').val())
  discount = parseFloat($('#discount').val())
  if !subtotal
  subtotal = 0
  if !discount
  discount = 0
  displayInvoice(subtotal,discount)

 

$(document).ready ->

$('.btn-pay').on('click', ->
payMeal(window.id)
)
$('#subtotal').on('keyup', ->
updateInfo()
)
$('#discount').on('keyup', ->
updateInfo()
)
$('.input-gst').on('click', ->
updateInfo()
)