如何在js中将数字转换为十六进制字符串

how to convert number to hexa string in js

本文关键字：转换 十六进制 字符串 数字 js      更新时间：2023-09-26

我想使用JS制作一个RGB到HEX转换器。为此，我执行了以下代码:

function convertToHex(){
            var r=document.getElementById("R").value;
            var g=document.getElementById("G").value;
            var b=document.getElementById("B").value;

            if(r>255 || g>255 || b>255){
                document.getElementById("error").innerHTML='R ,G, B value can not be greater than 255';
            }
            else{
                var rHex=r.toString(16);
                var gHex=g.toString(16);
                var bHex=b.toString(16);
                var toHex=rHex+gHex+bHex;
                document.getElementById("hexContainer").innerHTML=toHex;
            }       
        }

，但它不工作。你能帮帮我吗?它只显示数字而不显示转换后的值。

当您从HTML中获取值时，您需要将字符串转换为数字，

你可以做

var r = Number(document.getElementById("R").value);
我测试了其余的代码，它们工作得很好。

您可以试试这种方法。

<body>
 <input id="R" type="number">
 <br>
 <input id="G" type="number">
 <br>
 <input id="B" type="number">
 <br>
 <input id="btn" type="button"    onclick="rgb2hex()" value="calculate">
 <div id= "hexContainer"></div>
 <div id="error"></div>
<script>
function rgb2hex() {
var r = document.getElementById("R").value
    var g = document.getElementById("G").value
        var b =document.getElementById("B").value
 if (r> 255 || g> 255 || b> 255){
            document.getElementById( "error" ).innerHTML= 'R ,G, B value can not be greater than 255' ;
            document.getElementById( "hexContainer").innerHTML=""
        }
else {
document.getElementById( "hexContainer").innerHTML= ("#"+dec2Hex(Math.round(r)) +""+ dec2Hex(Math.round(g)) +""+dec2Hex(Math.round(b)));
document.getElementById( "error").innerHTML=""
}
 }
 function dec2Hex(decimal) {
return ("0"+(Number(decimal).toString(16))).slice(-2).toUpperCase()
}
  </script>
 </body>

function convertToHex(){

        var r=document.getElementById("R").value;
        var g=document.getElementById("G").value;
        var b=document.getElementById("B").value;

        if(+r>255 || +g>255 || +b>255){
            document.getElementById("error").innerHTML='R ,G, B value can not be greater than 255';
        }
        else{
            var rHex=(+r).toString(16);
            var gHex=(+g).toString(16);
            var bHex=(+b).toString(16);
            var toHex=rHex+gHex+bHex;
            document.getElementById("hexContainer").innerHTML=toHex;
        }       
    }
相关文章：