在鼠标悬停时填充隐藏字段的Javascript - 单击之前

时间:2016-10-12 14:54:45

标签: javascript php jquery ajax forms

寻找另一个问题的解决方案,我想到了在鼠标悬停上运行javascript的能力

我想运行这个:

$(document).ready(function(){

function myPayment()
{

var value = document.mortgagecalc.value_input.value;
var rate = document.mortgagecalc.rate_input.value;
var term = document.mortgagecalc.term_input.value;
var deposit = document.mortgagecalc.deposit_input.value;
var fee = document.mortgagecalc.fee_input.value;
var totalloan = ((value + fee) - deposit) * 1 + rate;
var totalinterest = (totalloan * 1 + rate) - totalloan;
var months = (term * 12);
var repay = totalloan / months;
var interest = totalinterest / months;

// Calculate mortgage payment and display result
document.getElementById('repay_input').value = repay;
document.getElementById('interest_input').value = interest;
}
}

当用户将鼠标悬停在我的提交按钮

上时

当脚本运行时,我希望填充这些字段,然后将其包含在表单操作中

<input type="hidden" name="repay" id="repay_input" value="">
<input type="hidden" name="interest" id="interest_input" value="">

现在它似乎没有用,但这可能是因为我错过了一件小事,或者它只是完全没有工作

谢谢 - 如果有人对如何实现我的目标有更好的了解,请告诉我,我已经尝试过PHP,但没有快乐

按钮清晰

<button class="col-sm-4 enter-button" type="submit" name="submit" onmouseover="return myPayment()" value="Calculate">Calculate Payments</button>

更新

我调整了javascript和按钮但是错过了命名表单以匹配JS中的引用

由于表格收集%rate

的方式,我的抵押贷款计算也被取消了

1 个答案:

答案 0 :(得分:0)

在jQuery&#39; document.ready包装器之外声明你的函数,你的按钮只需要看起来像这样:

function myPayment()
{
  var value = document.mortgagecalc.value_input.value;
  var rate = document.mortgagecalc.rate_input.value;
  var term = document.mortgagecalc.term_input.value;
  var deposit = document.mortgagecalc.deposit_input.value;
  var fee = document.mortgagecalc.fee_input.value;
  var totalloan = ((value + fee) - deposit) * 1 + rate;
  var totalinterest = (totalloan * 1 + rate) - totalloan;
  var months = (term * 12);
  var repay = totalloan / months;
  var interest = totalinterest / months;

  // Calculate mortgage payment and display result
  document.getElementById('repay_input').value = repay;
  document.getElementById('interest_input').value = interest;
}
<button onmouseover="myPayment()" ...></button>