2010-05-19 20 views
0

我正在开发一个新网站,并且在这里用户可以在输入文本框中键入价格。所以我需要的是一些jQuery代码来改变输入的价格。这意味着,当用户键入“1000”时,输入字段中的可见文本将自动转换为“1.000” - 带有句点。如果他们输入“10000”就应该变成“10.000”等。 你可以在这个网站上看到一个实例,我发现:http://www.boligsiden.dk/ 我知道它是丹麦语,但在地图下的首页,有输入字段。其中之一是说“最小kontaktpris”。你可以尝试在这里输入一个数字,并查看我正在寻找的效果。jQuery号码分隔符 - 每个号码分开1.000

有人知道我能做到吗?通过jQuery插件,或者通过一些“自制”代码?

回答

1

我会用数字格式在php.js: http://phpjs.org/functions/number_format:481

然后做这样的事情:

$(element).change(function() { 
    $(this).val(number_format($(this).val(), 0, '.', '.')); 
} 
+0

这将工作在一个.NET环境? – 2010-05-19 06:52:44

+0

我不在.NET中工作,但它完全是客户端,所以是的,它应该。 – 2010-05-19 06:53:48

1

JavaScript: The Good Parts

不要忘记感谢http://www.boligsiden.dk

function NumericBox_KeyDown(o, e, separate, allowComma) { 
    o.onkeypress = o.onkeyup = null; 
    if (!e) e = window.event; 
    var code = e.keyCode; 
    if (!code && e.which) code = e.which; 
    if (code >= 96 && code <= 105) code -= 48; 
    var preventDefault = ((code > 57 && (code != 110 && code != 188)) || code == 32 || (code >= 48 && e.shiftKey)); 
    if (!allowComma && (code == 188 || code == 110)) preventDefault = true; 
    if (!preventDefault) { 
     if (separate) { 
      if (NumericBox_CanSelect(o)) { 
       if (((code >= 48 && code <= 57) || code == 8 || code == 46 || code == 110 || code == 188)) { 
        preventDefault = NumericBox_FormatNumber(o, code, allowComma); 
       } 
      } 
     } 
    } 
    if (preventDefault) { 
     o.onkeypress = o.onkeyup = function (e) { 
      if (!e) e = window.event; 
      return false; 
     }; 
     return false; 
    } 
    return true; 
} 

function NumericBox_CanSelect(o) { 
    return (typeof(o.createTextRange) != 'undefined' || typeof(o.selectionStart) != 'undefined'); 
} 

function NumericBox_FormatNumber(o, code, allowComma) { 
    if (!allowComma && (code == 188 || code == 110)) return true; 
    var preventDefault = false; 
    var startPos = getSelectionStart(o); 
    var endPos = getSelectionEnd(o); 
    var s = o.value; 

    //delete all non numbers except one optional comma 
    var i = o.value.length - 1; 
    while (i >= 0) { 
     var c = s.charAt(i); 
     if (c < '0' || c > '9') { 
      if (c == ',' && allowComma == true) { 
       allowComma = false; 
      } else { 
       s = s.substring(0, i) + s.substring(i + 1); 
       if (startPos > i) startPos--; 
       if (endPos > i) endPos--; 
      } 
     } 
     i--; 
    } 
    if (startPos == 1 && s.charAt(0) == '0' && code == 48) preventDefault = true; 
    if (startPos == 0 && s.length > 0 && code == 48) preventDefault = true; 
    while (s.length > 0 && s.charAt(0) == '0' && s.charAt(1) != ',' && code != 48) { 
     s = s.substring(1); 
     startPos--; 
     endPos--; 
    } 
    if (code == 188 || code == 110) { 
     preventDefault = !allowComma; 
     if (allowComma && startPos == 0) { 
      s = '0' + s; 
      startPos++; 
      endPos++; 
     } 
    } 

    var s2 = s.substring(0, startPos); 
    for (var k = startPos; k < endPos; k++) 
    s2 += 'B'; 
    s2 += s.substring(endPos); 
    var s3 = s2; 
    var s4 = s; 
    if (code >= 48 && code <= 57 && !preventDefault) { 
     s3 = s3.substring(0, startPos) + 'A' + s3.substring(startPos); 
     s4 = s4.substring(0, startPos) + 'A' + s4.substring(startPos); 
    } 
    if (code == 8 && startPos == endPos && !preventDefault) { 
     if (s3.charAt(startPos - 1) == ',') { 
      s3 = s3.substring(0, startPos - 1) + 'B' + s3.substring(startPos); 
     } else { 
      s3 = s3.substring(0, startPos) + 'C' + s3.substring(startPos); 
      s4 = s4.substring(0, startPos) + 'C' + s4.substring(startPos); 
     } 
    } 
    if (code == 46 && startPos == endPos && !preventDefault) { 
     if (s3.charAt(startPos) == ',') { 
      s3 = s3.substring(0, startPos) + 'B' + s3.substring(startPos + 1); 
     } else { 
      s3 = s3.substring(0, startPos + 1) + 'C' + s3.substring(startPos + 1); 
      s4 = s4.substring(0, startPos + 1) + 'C' + s4.substring(startPos + 1); 
     } 
    } 

    var commaPos = s3.indexOf(','); 
    if (commaPos < 0) commaPos = s3.length; 
    if ((code == 188 || code == 110) && !preventDefault) commaPos = startPos; 
    var j = 0; 
    for (var l = commaPos; l > 0; l--) { 
     if (s3.charAt(l) == 'C') j -= 2; 
     if (j > 2) { 
      if (l <= startPos) { 
       startPos++; 
       endPos++; 
      } 
      s4 = s4.substring(0, l) + '.' + s4.substring(l); 
      j = 0; 
     } 
     if (s3.charAt(l - 1) != 'B') j++; 
    } 

    o.value = s4.replace('A', '').replace('C', ''); 
    setCursorPosition(o, startPos, endPos); 
    if (typeof(document.execCommand) != 'undefined') try { 
     document.execCommand('OverWrite', false, false); 
    } catch (e) {} 
    return preventDefault; 
} 


function getSelectionStart(o) { 
    if (o.createTextRange) { 
     var r = document.selection.createRange().duplicate() 
     r.moveEnd('character', o.value.length) 
     if (r.text == '') return o.value.length 
     return o.value.lastIndexOf(r.text) 
    } else return o.selectionStart 
} 

function getSelectionEnd(o) { 
    if (o.createTextRange) { 
     var r = document.selection.createRange().duplicate() 
     r.moveStart('character', -o.value.length) 
     return r.text.length 
    } else return o.selectionEnd; 
} 
+0

嗨Anurag。我刚刚尝试过这一个,但唯一的问题是我能看到的是,当我在输入字段中标记文本并按下一个新号码时,新号码就插入到旧号码的末尾。怎么会这样?它能解决吗? – 2010-05-26 13:34:44