2

我正在研究 EM 到 PX 转换器。基本上，您将代码粘贴到“PX”文本区域中，然后相同的代码将出现在带有 em 值的“EM”文本区域中。它有点工作，但不会取代所有实例的值。例如：如果你输入“padding: 5px;” 它会给你“填充：0.313em;” 成功地。但是......如果你输入“填充：5px 4px;” 它仅将“px”替换为“em”，而不是实际数值。

在这里自己尝试一下:: http://jsfiddle.net/tJsNz/

        function pxToEm(){
        var px = document.getElementById("px"),
            em = document.getElementById("em"),
            parent = document.getElementById("parent-font-size");

        var pxVal = px.value.match(/\d+/ig);
        var pxToEm = 1 / parent.value * pxVal;
        var pxToEmFixed = pxToEm.toFixed(3);
        var pxToEmAnswer = px.value.replace(pxVal, pxToEmFixed).replace(/px/ig, "em");

        em.value = pxToEmAnswer;
    }
4

1 回答 1

6

考虑使用.replace回调函数。我认为这就是您想要的 - 找到每个匹配项并根据它进行替换。

String 的.replace方法可以接受回调作为第二个参数，并在每次匹配时运行该回调。您可以运行它并匹配所有数字，然后用它们的翻译值替换它们。

举一个更简单的例子

var i=0;
"aaaaaa".replace(/a/g,function(match){
    return i++;
});

将返回"012345"。这是来自 MDN 的另一个示例

在您的情况下，例如：

var pxToEmAnswer = px.value.replace(/\d+/ig, function(match){
    return 1 / parent.value * match;
}).replace(/px/ig, "em");

（小提琴）

于 2013-07-30T20:36:49.920 回答