javascript - 回发时 Gridview 内的下拉菜单不保留背景颜色

Question

我有一个<asp:DropDownList>里面 <asp:TemplateField>在 GridView 中:

<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False" DataSourceID="DatosTablaHandoff">
        <Columns>
            <asp:TemplateField HeaderText="STATUS">
                <ItemTemplate>
                    <asp:DropDownList ID="DropDownGV" runat="server" onchange="SetDropDownListColor(this);">
                    <asp:ListItem>Select...</asp:ListItem>
                    <asp:ListItem>Complete</asp:ListItem>
                    <asp:ListItem>Running</asp:ListItem>
                    <asp:ListItem>Waiting in SEV 1</asp:ListItem>
                    <asp:ListItem>No Batch</asp:ListItem>
                </asp:DropDownList>
                </ItemTemplate>
            </asp:TemplateField>
        </Columns>
    </asp:GridView>

我有一个 js 脚本来根据所选项目设置“项目背景颜色”:

function SetDropDownListColor(ddl) {
        for (var i = 0; i < ddl.options.length; i++) {
            if (ddl.options[i].selected) {
                switch (i) {
                    case 0:
                        ddl.style.backgroundColor = 'White';
                        return;
                    case 1:
                        ddl.style.backgroundColor = 'lightgreen';
                        return;
                    case 2:
                        ddl.style.backgroundColor = 'Yellow';
                        return;
                    case 3:
                        ddl.style.backgroundColor = 'orangered';
                        return;
                    case 4:
                        ddl.style.backgroundColor = 'Grey';
                        return;
                }
            }
        }
    }

一切正常。但是当回发时，颜色消失了。每行中的下拉菜单都保留我想要的选定值，但背景色为白色。

我有另一个脚本(在函数之外)，用于在回发时“保存”颜色，但它仅在 DropDownList 位于 GridView 之外时才有效:

window.addEventListener('load', function () { SetDropDownListColor(document.getElementById('<%= DropDownList1.ClientID %>')); }, false);

Answer 1

谢谢!它不是 100% 正确，因为我必须做一些更改，但它有很大帮助!这对我有用:

window.addEventListener('load', function () {
var dropdowns = new Array(); 
var gridview = document.getElementById('<%= GridView1.ClientID %>'); 
dropdowns = gridview.getElementsByTagName('select'); 
for (var i = 0; i < dropdowns.length; i++) { 
SetDropDownListColor(dropdowns[i]); } }, false);