Javascript 根据复选框的状态更新十六进制字中的位值，反之亦然

我有一个文本框和一组复选框，它们应该链接在一起。textbox中的值是基于复选框状态的等效十六进制值

在HTML端，我有ID为oc0到oc19的复选框，每个复选框都应该控制十六进制值的0到19位，反之亦然。
我所做的是，我可以根据复选框ID号（0-19）获得位权重，并且我可以理解哪个复选框应该控制哪个位。但我不知道如何在JS函数中实现这一点。这是我到目前为止所拥有的

这是复选框块

CK_0
CK_1
CK_2
截至19日，结构相同

这是我的文本框：

<label>SBI 20 bit OE Word:</label>
<input type="text" value="0x00000" id="textboxSbiCK" class="guiTextBox" style="width:75px;margin-left: 10px">

我希望文本框和复选框的值相互关联，因此通过更改文本框值、复选框的状态更改，或者通过更改每个复选框的状态，十六进制值得到更新

选中=1

---

unchecked=0

这里是一个基于十六进制转换器的用例实现。有关指导原则，请参见内部评论：

//十六进制前缀
var hex_prefix=“0x”；
//添加初始复选框
var\u计数=19；
var复选框=”；
对于（var count=0；count=0；checkbox--）
{
//concat复选框状态以形成位
位_value+=（复选框[checkbox]。选中-0）；//返回1或0，而不是真/假
}
var hex=工具。转换二进制到十六进制（位值）；
//将值设置为textbox
document.getElementById（“textboxSbiCK”）.value=hex\u前缀+hex；
//警报（tools.convertBinaryToHexadecimal（十六进制前缀+hex））；
//警报（位值）；
dummyBlink（）；
}
函数converter hextobit（）{
var hex=document.getElementById（“textboxSbiCK”）.value；
//验证十六进制输入
如果（！hex.length>2）返回；
if（十六进制子字符串（0,2）！=hex_前缀）返回；
//转换为十六进制
变量位=工具。转换器十六进制二进制（十六进制）；
//验证位
如果（！位）返回；
//从位中删除填充和坏格式
位=位。替换为（“00000 NaN”，“”）；
//检索所有复选框并应用新状态
var checkbox=document.querySelectorAll（'.checkboxSbiCK'）；
对于（变量索引=复选框。长度-1；索引>=0；索引--）
{
//从位设置复选框状态
复选框[index]。选中=位[checkbox.length-index-1]-0；//转换为int
}
//警报（bits）；
dummyBlink（）；
}
函数dummyBlink（）{
//更改背景颜色以指示已触发操作的UI方法
document.getElementById（“复选框”）.style.backgroundColor=“#eeff”；
setTimeout（函数（）{
document.getElementById（“复选框”）.style.backgroundColor=“#ffffff”；
}, 500);
}
//user2503552提供的帮助对象
//发件人：https://stackoverflow.com/questions/17204912/javascript-need-functions-to-convert-a-string-containing-binary-to-hex-then-co
变量工具={
/**
*将二进制代码转换为十六进制字符串
*@param{string}binaryString包含二进制数的字符串，例如“01001101”
*@return{string}包含十六进制数的字符串
*/
convertBinaryToHexadecimal:函数（二进制字符串）
{
var输出=“”；
//对于二进制字符串中的每4位
对于（变量i=0；i=totalCharacters）
{
返回输入字符串；
}
//计算出需要向字符串中添加多少额外字符
var charsToAdd=（totalCharacters-inputString.length）/padCharacter.length；
//在字符串上添加填充
对于（变量i=0；i

SBI 20位OE字：
验证输入
非常感谢。这是转换例程中的一个小错误，没有将正确的复选框连接到正确的位。我修正了这个问题并编辑了你的函数。现在就像一个符咒。谢谢你

// ---------------------------------------------------------------- 
    // checkbox change event    
    // ----------------------------------------------------------------
    document.querySelectorAll(".checkboxSbiCK").forEach(function(checkboxSbiCK)
    {   
        checkboxSbiCK.addEventListener("change", function(e)            
        {

            var textboxSbiCK = document.getElementById("textboxSbiCK").value;
            var checkbox = document.getElementById(this.id);
            var outputId = checkbox.id.match((/(checkboxSbiCK-)(.*)$/))[2];
            var outputBitNum = outputId.substring(2);//remove oc from the name and just get the output number
            var outputBitWeight= 2**outputBitNum; // calculate the weight of the bit based on output number. 
            //...... to be completed

        });
    });