【问题标题】：.replace not removing characters.replace 不删除字符
【发布时间】：2014-06-17 20:58:14
【问题描述】：

所以我试图将 PX 转换为 EM，但如果用户输入 16px，而不是 16，我想删除 PX。这是我正在使用的

.replace(/^EM+/i, '')

但由于某种原因，它没有被删除。

Here's a demo。使用PX 输入任何值，您将获得NaN。还有一种方法可以抑制NaN，这样它就不会显示了？

【问题讨论】：

将其更改为 px.replace(/PX$/i, ''); 尽管 parseInt 可能适用于这种特殊情况。
也许parseFloat() 在这种情况下会更好，因为也可以有浮点值（parseFloat 和 parseInt 将自动跳过 px 或 em 的末尾）
你能演示一下吗？ @BogdanSavluk
@user302975 plnkr.co/edit/VQo0eWgjzgH9gi0g5rA3

标签： javascript jquery html regex

【解决方案1】：

我对此的理解是^字符指定了行首，+字符指定了至少其中一个...This example works:

.replace(/EM+/i, '')

【讨论】：

完美答案。还有一个问题是我怎样才能摆脱NaN。因为当用户填写它，并说他们在填写5em时填写5e，它会在PX框中显示NaN。
@user302975，您可以使用parseFloat，在这种特殊情况下不要删除em...或使用/em?/i 表达式

【解决方案2】：

最简单的方法可能是删除keyup 上所有不是[0-9\.]（句点或数字）的字符。然后，您可以执行计算并更新<input>s。

fiddle

HTML

px <input type="text" id="px"> <br>
em <input type="text" id="em">

JavaScript

$("#px").keyup(function () {
    var px = $(this).val().replace(/[^\d\.]+/g, "");   // replace all non 0-9 or .
    $(this).val(px);
    $("#em").val(parseInt(px)/16);               // set the value of em to px/16
})
$("#em").keyup(function(){
    var em = $(this).val().replace(/[^\d\.]+/g, "");  // replace all non 0-9 or .
    $(this).val(em);
    $("#px").val(parseInt(em) * 16);            //set the value of px to em*16
})

【讨论】：

【解决方案3】：

分叉小提琴：http://jsfiddle.net/FDkLa/

不要使用^，因为它告诉匹配字符串的开始。

【讨论】：

【解决方案4】：

^ 匹配字符串的开头，所以这只会删除开头的 px。改用这个：

.replace(/EM/i, '')

+ 也是不必要的； M+ 它匹配 1 个或多个 M（例如“EMMM”匹配）。

【讨论】：

【解决方案5】：

你可能想在你的事件监听器中尝试这样的事情：

var val = this.value;
if (/^\d+(?:px)?$/i.test(val)) {
    // do conversion stuff
} else {
    // display error to user, perhaps a red border on the input
}

【讨论】：

【解决方案6】：

你去。

去除所有字符，只留下数字。不再有 NaN。

编辑：好的，解决了数量庞大的问题。

在此确认Latest Version

$(document).ready(function () {
  $('.px').keyup(function () {
    var px = $(this).val().replace(/\D/g,'');
    var rep = (px / 16);
    $('.em').val(rep);            
  });    
  $(".em").keyup(function () {
    var em = $(this).val().replace(/\D/g,'');
    var rem = (em * 16);
    $('.px').replace().val(rem);
  });     
});

【讨论】：

转到 em 部分。在PX部分输入15e，得到NaN。
修复了小提琴链接。现在工作！
很好，谢谢。你回答了这两个问题。但是一个问题。输入px，然后得到em结果。并将其重新粘贴到 em 结果中。这将是一个巨大的数字
好的，让我再看看