2014-08-28 149 views
1

您好我正在尝试在我的网站上安装一个商家设施,它需要提交价值$ vpc_Amount,这是以美分购买的金额。Javascript提交隐藏字段提交

我需要做的是将用户输入的金额($金额)乘以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; 
} 

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

+0

你什么意思偶尔?对我来说似乎没问题,除非你输入一个非数字输入 – Ghost 2014-08-28 06:45:56

+0

如果你想根据'amount'提交'vpc_Amount'的值,你不需要监听'onkeypress'事件。监听'onsubmit'事件,并在那里设置'vpc_Amount'值。 – hindmost 2014-08-28 07:04:35

回答

1

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

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

根据未在帖子或标签中提及的图库发布答案是吸引选票的好方法。 – RobG 2014-08-28 06:50:17

0

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

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

此外,我建议您尝试将文本字段的值转换为整数并添加其他输入处理。用户可能会输入任何类型的数据,并可能导致您的JavaScript代码崩溃。

1

尝试使用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; 
} 
+0

工作正常!传说! – shwareal 2014-08-28 06:51:34

+0

欢迎您。你需要批准答案:) – 2014-08-28 06:54:24

0

此代码应工作:在文本字段,并keyup价值变动之前

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

keypress事件触发价值发生变化后。

基本上事件触发顺序:

  • ​​(onkeydown事件)
  • keypress(onkeypress事件)
  • keyup(的onkeyup)

value是整数或你会得到NaN在某些情况下。

0

我会建议使用onblur这是最好的方法,如果你想使用构建属性监听器,如果你不使用jQuery。下面是例子:

<!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> 

和URL在W3学校:) http://www.w3schools.com/jsref/event_onblur.asp

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); 
    }); 
}); 
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; 
} 

您可能希望使用变化事件,而不是在用户输入时不必要地更新隐藏字段,也可以捕获不基于按键操作的更改(例如,从上下文菜单中粘贴)。

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