回发后无法从Javascript中使用CSS颜色

CSS Colours not working from Javascript after postback

本文关键字：CSS 颜色 Javascript      更新时间：2023-09-26

我有一个web应用程序，在其中我正在进行一些客户端验证。这是通过添加到每个Asp:TextBox 来完成的

onkeyup="javascript: value_change(this);"

一旦值发生变化，我就有了这个Javascript。。。

function value_change (text_box) {
    // validate code here
    if (valid) {
        text_box.className = "normalInput";
        document.getElementById("GoButton").disabled = false;
    }
    else {
        text_box.className = "errorInput";
        document.getElementById("GoButton").disabled = true;
    }
}

className对应于CSS类，其突出部分如下所示：-

.normalInput
{
    background-color: #ffffff;
}
.errorInput
{
    background-color: #ff0000;
}

当页面最初显示时，这可以很好地工作，但在第一次回发后，尽管调用了函数、类名集和GoButton敏感度集(我已经通过调试来演示了这一点(，但背景颜色不会改变。

有人知道为什么会这样吗？我该怎么办？

Edit根据@Pete的建议，我在为text_box分配新类名后立即检查了它，并且currentStyle属性似乎保持不变。currentStyle的特性与normalInput类相同；我调整了一下，然后重新运行以进行检查。因此，我推断这个赋值被忽略了，而不是一个不同的CSS以某种方式工作。

客户端上更改的样式不会发送回服务器。您必须自己在服务器上设置属性才能持久化它们。服务器根据服务器上可用的一组属性构建控件定义，并重新呈现原始值。这是因为只有文本框的值会返回到服务器；其他一切都不是。

话虽如此，您可以解释启用或禁用按钮的条件，并设置适当的CSS样式，在服务器上设置这些属性，或者在文档加载时重新应用这些样式。

经过多次咒骂，我终于得到了在回发后更改背景颜色的验证，如下所示：-

function value_change (text_box) {
    // validate code here
    if (valid) {
        text_box.className = "normalInput";
        document.getElementById(text_box.name).style.backgroundColor = "#ffffff";
        document.getElementById("GoButton").disabled = false;
    }
    else {
        text_box.className = "errorInput";
        document.getElementById(text_box.name).style.backgroundColor = "#ff0000";
        document.getElementById("GoButton").disabled = true;
    }
}

I.e通过手动设置。我不太喜欢这个，因为它推动了一个教练和四个CSS类的全部目的。如果有人能想出更好的办法，我会洗耳恭听的。

相关文章：