Question

我有一个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灵敏度集（我通过调试逐步演示了它），背景颜色不会改变。

有谁知道为什么这是我应该做些什么呢？

编辑根据@ Pete的建议，我在分配新的类名后立即检查了text_box，并且看起来currentStyle属性保持不变。 currentStyle的特性与normalInput类相同;我调整了它们并重新运行它来检查。所以我推断出赋值被忽略了，而不是以某种方式使用不同的CSS。

Answer 1

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

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

Answer 2

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

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;
    }
}

即通过手动设置。我不喜欢这个，因为它正在推动一个教练和四个人完成CSS类的整个目的。如果有人能想出更好的东西我就是全智的。

回发后CSS颜色无法使用Javascript

2 个答案: