Question

我正在尝试检查字段以确定它是否是数字（除了。之外没有非数字字符）。如果字段的值是数字，请将其转换为两位小数格式。目前代码在FireFox和Chrome中运行，但我在使用Internet Explorer时遇到了问题（多个版本，特别是在IE8和IE9上测试过）。我已经搞乱了几个小时，并且无法找到问题的解决方案。在Internet Explorer中，只有第一个字段正常工作。其他字段无法正常工作，Internet Explorer不会触发错误。

这是html文件中的相关代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">

 <head>
  <script type="text/javascript" src="amount.js"></script>
 </head>

 <body>
  <input type="text" id="amount1" onChange="changeAmount(this.id);"/>
  <input type="text" id="amount2" onChange="changeAmount(this.id);"/>
  <input type="text" id="amount3" onChange="changeAmount(this.id);"/>
  <input type="text" id="amount4" onChange="changeAmount(this.id);"/>
  <input type="text" id="amount5" onChange="changeAmount(this.id);"/>
 </body>
</html>

这是来自amount.js的相关代码：

function changeAmount(input)
{
   var pattern = /([^0-9\.])+/;
   var ctl = document.getElementById(input);
   var myvalue = ctl.value;

   if(myvalue != "" && !pattern.test(myvalue))
   {
     myvalue = parseFloat(myvalue);
     myvalue = myvalue.toFixed(2);
     if(!pattern.test(myvalue))
     {
        ctl.value = myvalue;
     }else
     {
        ctl.value = '';
     }
   }
}

我将在这里浏览更多线程，看看我是否找不到解决方案。

感谢您提前提供任何帮助。

Answer 1

使用此HTML：

<input type="text" id="amount1" onChange="changeAmount(this);"/>
<input type="text" id="amount2" onChange="changeAmount(this);"/>
<input type="text" id="amount3" onChange="changeAmount(this);"/>
<input type="text" id="amount4" onChange="changeAmount(this);"/>
<input type="text" id="amount5" onChange="changeAmount(this);"/>

尝试使用此Javascript：

function changeAmount(input) {
    var myvalue = input.value;
    myvalue = parseFloat(myvalue);
    if (!isNaN(myvalue)) {
        input.value = myvalue.toFixed(2);
    } else {
        input.value = "";
    }
}

DEMO： http://jsfiddle.net/7rDeg/4/

它使用我建议的将this而不是this.value传递给函数的更改。

此外，不需要正则表达式。只需尝试使用parseFloat解析值。如果成功，则将数字固定为2位小数并重新设置输入值。否则，请清除文本框。

<强>更新

虽然这一切都可以正常工作，但我建议不要使用内联事件处理程序。因此，例如，使用此HTML是理想的：

<input type="text" id="amount1" />
<input type="text" id="amount2" />
<input type="text" id="amount3" />
<input type="text" id="amount4" />
<input type="text" id="amount5" />

使用此Javascript：

function changeAmount() {
    var myvalue = this.value;
    myvalue = parseFloat(myvalue);
    if (!isNaN(myvalue)) {
        this.value = myvalue.toFixed(2);
    } else {
        this.value = "";
    }
}

function addEvent(element, eventName, callback) {
    if (element.addEventListener) {
        element.addEventListener(eventName, callback, false);
    } else if (element.attachEvent) {
        element.attachEvent("on" + eventName, callback);
    } else {
        element["on" + eventName] = callback;
    }
}

window.onload = function () {
    var inputs = document.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        if (inputs[i].type === "text") {
            addEvent(inputs[i], "change", changeAmount);
        }
    }
};

DEMO： http://jsfiddle.net/7rDeg/6/

注意：使用parseFloat，它将删除任何尾随的非数字字符。例如，输入“234.35234a”将被解析为“234.35234”（因此传递!isNaN(myvalue)条件）并固定为“234.35”。如果您不希望发生这种情况，请使用：

myvalue = +myvalue;

而不是parseFloat行。

JS函数不适用于多输入文本字段在Internet Explorer中

1 个答案: