Javascript在提交时更改隐藏字段

时间:2014-08-28 06:39:48

标签: javascript forms

您好我正在尝试在我的网站上安装商家设施,并且需要提交价值$ vpc_Amount,这是以美分购买的金额。

我需要做的是将用户输入的金额($ amount)乘以100以获得$ vpc_Amount。

我尝试了以下但是没有用。

<input type="text" ID="A1" name="amount"onkeypress="process1()">
<input type="hidden" id="A2" name="vpc_Amount">

然后是javascript

function process1() {
    f1 = document.getElementById("A1").value;
    total = f1*1000;
    document.getElementById("A2").value = total;
}

正在发生的事情是它偶尔会起作用,但大部分时间它都没有。我知道脚本有问题所以请问这里。

7 个答案:

答案 0 :(得分:2)

使用Jquery。 http://jquery.com/

$(function() {
    $('#form_id').submit(function(){
        $('#form_id').find('#A2').val('New value');
        return true;
    });
});

答案 1 :(得分:2)

尝试使用onkeyup功能 -

<input type="text" id="A1" name="amount" value="" onkeyup="process1();" />
<input type="hidden" id="A2" name="vpc_Amount" />

javascript函数 -

function process1() {
    var f1 = document.getElementById("A1").value;
    var total = (f1 * 100);
    document.getElementById("A2").value = total;
}

答案 2 :(得分:0)

您是否尝试过使用onkeyup事件?可能是因为在将字符添加到文本字段之前触发了onkeypress事件。

<input type="text" ID="A1" name="amount" onkeyup="process1()">

另外,我建议您尝试将textfield的值转换为整数并添加其他输入处理。用户可能会在那里输入任何类型的数据,这可能会导致您的javascript代码崩溃。

答案 3 :(得分:0)

此代码应该有效:

document
  .getElementById('A1')
  .addEventListener('keyup', function (e) {
    document.getElementById('A2').value = parseInt(this.value) * 1000;
  })

keypress事件在文本字段中的值更改之前触发,在值更改后keyup触发。

基本上按顺序触发事件:

  • keydown(onkeydown)
  • keypress(onkeypress)
  • keyup(onkeyup)

强制value为整数,或者在某些情况下您会获得NaN

答案 4 :(得分:0)

如果您不使用jquery,我建议使用onblur这是最好的方法,如果你想使用build in属性监听器。这是一个例子:

  <!DOCTYPE html>
  <html>
  <body>

  Enter your name: <input type="text" id="fname" onblur="myFunction()">

  <p>When you leave the input field, a function is triggered which transforms the input             text to upper case.</p>

  <script>
  function myFunction() {
      var x = document.getElementById("fname");
      x.value = x.value.toUpperCase();
  }
  </script>

  </body>
  </html>

并在w3学校的例子中写道:} http://www.w3schools.com/jsref/event_onblur.asp

答案 5 :(得分:0)

首先,我认为你应该使用onkeypup事件而不是onkeypress

<input type="text" id="A1" name="amount" onkeyup="process1()" value="" />
<input type="hidden" id="A2" name="vpc_Amount" value="" />

Javascript代码 -

function process1() {
    var f1 = parseFloat(document.getElementById("A1").value);
    var total = f1*100; //you said 100 so, I changed to 100
    document.getElementById("A2").value = total;
}

jQuery代码 -

jQuery(document).ready(function($){
    $("#A1").keyup(function(){
     var total = parseFloat($("#A1").val()) * 100;
    $("#A2").val(total);
  });
});

答案 6 :(得分:0)

您可以通过使用表单控件作为其名称上的表单的命名属性这一事实来简化您的代码。这样就无需为了必须具有名称的表单控件添加ID。

在侦听器中传递对控件的引用:

<input type="text" name="amount" onkeyup="process1(this)">
<input type="hidden" name="vpc_Amount">

然后使用传递的引用来获取表单和其他控件:

function process1(element) {
    element.form.vpc_Amount.value = element.value * 100;
}

您可能希望使用更改事件来保存在用户键入时不必要地更新隐藏字段,以及捕获不基于按键的更改(例如从上下文粘贴)菜单)。

您还应该对输入的值进行一些验证,这样用户就不会尝试发送包含无效值的表单(注意您还必须在服务器上进行验证,因为客户端验证很有帮助,但完全不可靠)。 / p>

相关问题