用整数或小数值将px转换为mm

Convert px to mm with integer or fractional values

本文关键字:px 转换 mm 整数 小数      更新时间:2023-09-26

我发现一些代码通过使用正则表达式解析来转换CSS中的值。它可以很好地处理整数值,但是当我尝试转换像10.15px这样的小数值时,它会忽略小数点右边的数字,并给出像10.6.613756613756614mm这样的值。

下面是我的代码:
searchPX = new RegExp('(''d+)px', 'g');
searchPXDec = new RegExp('('d+'.'d+)px', 'g');
$('button').on('click', function() {
    var css = $('textarea').val();
    var css2 = $('textarea').val();
    var result;
    var result2;
    if ((result = searchPX.exec(css)) !== null) {
        var px = parseInt(result[1]);
        var mm = px / 3.78;
        css = css.replace(px + 'px', mm + 'mm');
        $('textarea').val(css);
    }
    else if((result = searchPX.exec(css)) == null) {
        result2 = searchPXDec.exec(css2);
        if(result2 !== null) {
            var pxdec = parseFloat(result2[1]);
            var mmdec = pxdec / 3.78;
            css2 = css2.replace(px + 'px', mm + 'mm');
            $('textarea').val(css2);
        }
    }
});

我尝试匹配两个正则表达式,然后使用parseInt为整个值和parseFloat为分数值,但它不工作。

下面是代码的实时版本:http://jsfiddle.net/trtcN/575/

可以用[0-9.]+匹配整数值和小数值。你所需要的只是这个正则表达式:

var searchPX = new RegExp('([0-9.]+)px', 'g');

代码中的另一个问题是您没有正确使用全局匹配。不应该用if执行一次正则表达式,而应该用while反复测试它,直到匹配耗尽。

示范:

var searchPX = new RegExp('([0-9.]+)px', 'g');
$('button').on('click', function() {
    var css = $('textarea').val(),
        newCss = css.slice();
    var result;
    while ((result = searchPX.exec(css)) !== null) {
        var px = result[1];
        var mm = px / 3.78;
        newCss = newCss.replace(px + 'px', mm + 'mm');
    }
    $('textarea').val(newCss);
});
textarea {
    width: 100%;
    height: 200px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<button>Convert PX to MM!</button>
<textarea>
#content {
    height: 50px;
    height: 50.14159px;
    height: 50.0px;
}
</textarea>