1

所以我正在制作一个 em 到 px 的转换器，当您将 css 粘贴到“px”文本区域时，它会将每个 px 值转换为 em。如果您输入“填充：10px;”之类的内容，它会起作用 然后转换，但如果你输入“填充：10px 0 40px 0;” 它只会将“10px”更改为“10em”。我希望它转换所有这些，而不仅仅是一开始就停止。有任何想法吗？

这是 jsFiddle :: http://jsfiddle.net/CJamj/

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

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

        em.value = pxToEmAnswer;
    }
4

1 回答 1

2

Javascript replace() 方法在第一个字符串中搜索指定值并返回一个新字符串，其中指定的值被替换。javascript 中不存在这样的方法 replaceAll() 。因此，为了实现这一点，我们必须使用正则表达式在字符串中进行搜索。

最简单的方法是，使用带有“g”标志的正则表达式来替换所有实例：

尝试这个：

px.value.replace(pxVal, pxToEmFixed).replace(/px/g, "em")

将 px 转换为 em：

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

    var pxVal = px.value.match(/\d+px/g).toString().split(',');
    var lengthValue = pxVal.length;

    var pxToEmAnswer;
    for(var i = 0; i < lengthValue; i++)
    {
        var valueToBeReplced = pxVal[i].replace(/px/g, "");;
        var valueToBeReplcedExp = new RegExp(valueToBeReplced, "ig");
        pxToEmAnswer = px.value.replace(valueToBeReplcedExp,  (1/parseInt(parent.value) * valueToBeReplced).toFixed(3));
    }
    em.value = pxToEmAnswer.replace(/px/g, "em");
}

小提琴

于 2013-07-30T05:22:17.517 回答