Javascript 为什么透明度rgba只能第一次工作

应使用rgba更改透明度，但不应更改rgb。只有“a”可以更改。如果我想在第二次更改该值为null，它只在第一次工作。我错在哪里

<select id="elementbackgroundtransparency" onchange="ElementBackgroundTransparency()">
    <option value="1">1</option>                 
    <option value="0.1">0.1</option>                 
    <option value="0.2">0.2</option>                
    <option value="0.3">0.3</option>                 
    <option value="0.4">0.4</option>                 
    <option value="0.5">0.5</option>                 
    <option value="0.6">0.6</option>
    <option value="0.7">0.7</option>
    <option value="0.8">0.8</option>
    <option value="0.9">0.9</option>
</select>

<div id="color" style="height:50px;width:50px;background-color:rgba(255,0,0,0.3);"></div>

---

可能是您的RGB索引不是从0开始的，因为RGBA中的A值等于零，因此您的函数第一次运行良好

var theCSSprop = window.getComputedStyle(elem, null).getPropertyValue("background-color");

返回rgba（255，0，0）哪个值是您的正则表达式的正确值

但当您从下拉菜单中更改选项时，脚本将返回rgba（255，0，0，0.3），这是正则表达式的错误输入

在传递给regex之前，您必须更正cssprop的值

function ElementBackgroundTransparency(){
        var t = document.getElementById("elementbackgroundtransparency").value;
        var elem = document.getElementById("color");
        var theCSSprop = window.getComputedStyle(elem, null).getPropertyValue("background-color");
        theCSSprop = theCSSprop.split(",");
        if(theCSSprop.length > 3){
            theCSSprop[0] = theCSSprop[0].replace("a","");
            theCSSprop.splice(-1, 1);
            theCSSprop = theCSSprop.join(",");
            theCSSprop += ")";
        }
        console.log(theCSSprop);
        var rgb = /rgb\((\d+), (\d+), (\d+)\)/.exec(theCSSprop);
        if(rgb !== null){
            var r = rgb[1];
            var g = rgb[2];
            var b = rgb[3];
            document.getElementById("color").style.backgroundColor = "rgba("+r+", "+g+", "+b+""+", "+t+")";
        }else{
            console.log(rgb,"failed");
        }
}

---

我知道错误在哪里。最简单的处理方法是什么。我试过了，但没用。在您的示例中，我经常得到：未能在“窗口”上执行“getComputedStyle”：参数1不是“元素”类型。已修复代码。出现错误，因为您的正则表达式需要rgb（0,0,0）格式的值，但我的代码将其发送到rgba（255,0,0）。谢谢。它工作得很好。我想问你另一个细节。我使用可点击的多个div，因此每个div都有不同的“a”值。单击div，我需要将其值插入select（选项）。如何从每个部门获得a？如果您的问题已解决，请将其标记为已解决并进行投票。对于您的查询，请找到我标记为已解决的JSFIDLE链接！在现有代码中是否有在纯javiscript中的选项中插入“a”的选项（无jQuery）。谢谢我希望这对其他人也有用

function ElementBackgroundTransparency(){
        var t = document.getElementById("elementbackgroundtransparency").value;
        var elem = document.getElementById("color");
        var theCSSprop = window.getComputedStyle(elem, null).getPropertyValue("background-color");
        theCSSprop = theCSSprop.split(",");
        if(theCSSprop.length > 3){
            theCSSprop[0] = theCSSprop[0].replace("a","");
            theCSSprop.splice(-1, 1);
            theCSSprop = theCSSprop.join(",");
            theCSSprop += ")";
        }
        console.log(theCSSprop);
        var rgb = /rgb\((\d+), (\d+), (\d+)\)/.exec(theCSSprop);
        if(rgb !== null){
            var r = rgb[1];
            var g = rgb[2];
            var b = rgb[3];
            document.getElementById("color").style.backgroundColor = "rgba("+r+", "+g+", "+b+""+", "+t+")";
        }else{
            console.log(rgb,"failed");
        }
}