css不适用于Jquery Validations中的文本框答案

【问题标题】：css not applying to textbox in Jquery Validationscss不适用于Jquery Validations中的文本框
【发布时间】：2014-02-05 05:08:13
【问题描述】：

嗨，我正在尝试使用 jquery 验证空文本框。我只是想更改无效文本框的颜色。

我正在尝试使用以下代码。

<td width="10%" class="td">
    <asp:TextBox runat="server" ID="txtRemark" ClientIDMode="Static" TextMode="MultiLine" CssClass="remarks"></asp:TextBox>
</td>
<asp:Button runat="server" ID="imgSubmit" Text="SUBMIT" OnClientClick="validate()" ClientIDMode="Static" />
$("#imgSubmit").click(function validate() {
    var name = $("#<%=txtRemark.ClientID %>").val();
    if (name == "") {
        alert("Validation working");
        $("#txtRemark").css({
            "border": "1px solid red",
            "background-color": "#FFCECE"
        });
    } else {
        alert("Welcome: " + name);
    }
});

但是这个 CSS 并没有被应用到文本框。我已经包含了 jquery-1.9.1.js、jquery-ui.css、jquery-ui.js、jquery-1.7.2.min.js。

我正在工作。但是 CSS 没有应用，我在某个地方错了..，请帮助我。提前致谢。

【问题讨论】：

建议：使用.on而不是.click
将function validate() 更改为function()
不使用。，使用点击，它进入并得到警报。刚刚用了.on它不起作用。
尝试alert name 喜欢alert(name);
@RohanKumar 我有警报（名称）显示为空警报。这意味着条件已满足，但 CSS 未应用于文本框

标签： jquery css jquery-ui validation

【解决方案1】：

当您应用css 并从按钮控件中删除OnClientClick="validate()" 时，使用<%=txtRemark.ClientID %> 代替txtRemark，例如，

<td width="10%" class="td">
    <asp:TextBox runat="server" ID="txtRemark" ClientIDMode="Static" TextMode="MultiLine" CssClass="remarks"></asp:TextBox>
</td>
<asp:Button runat="server" ID="imgSubmit" Text="SUBMIT" OnClientClick="validate()" ClientIDMode="Static" />

将您的代码包装在document.ready() 中，

$(function(){
    $("#imgSubmit").click(function() {
        var name = $("#<%=txtRemark.ClientID %>").val();
        if (name == "") {
            alert("Validation working");
            $("#<%=txtRemark.ClientID %>").css({ // use <%=txtRemark.ClientID %> here also
                "border": "1px solid red",
                "background-color": "#FFCECE"
            });
        } else {
            alert("Welcome: " + name);
            $("#<%=txtRemark.ClientID %>").removeAttr('style'); // remove applied css
        }
        return false;// use to prevent reload page
    });
});

否则你可以试试html controls而不是asp.net之类的，

<td width="10%" class="td">
    <input type='text' id="txtRemark" class="remarks" />
</td>
<input type="submit" id="imgSubmit" value="SUBMIT" />

$(function(){
    $("#imgSubmit").click(function() {
        var name = $("#txtRemark").val();
        if (name == "") {
            alert("Validation working");
            $("#txtRemark").css({
                "border": "1px solid red",
                "background-color": "#FFCECE"
            });
        } else {
            alert("Welcome: " + name);
            $("#txtRemark").removeAttr('style'); // remove applied css
        }
        return false;// use to prevent reload page
    });
});

【讨论】：

CSS 颜色变化不会持续更长时间，它只是闪烁并消失。我希望颜色变化一直存在，直到他填充一些文本
我想删除 else 部分中的那个 css，直到那时我想应用 css，但它只是几秒钟
点击按钮后页面是否刷新？如果是，请在您的click() 中使用return false;，查看我的更新答案
在其他部分我如何再次删除 CSS ？？？当他输入文字时，它不能是红色

【解决方案2】：

您不能在 click 方法中使用命名函数，而是将其用作回调。

function validate(){...}

$("#imgSubmit").click(validate);

或者只是替换命名函数

$("#imgSubmit").click(function validate() {

与

$("#imgSubmit").click(function(){

【讨论】：

只需检查我编辑的问题。我在按钮点击中使用该验证
如果我使用 click(function(){ 我认为在按钮上写 onClientClick 没有用？？
抱歉 CSS 仍然没有应用到我的文本框。我刚开始警觉。
测试它，通过编辑 if (name == "hello") 然后在文本框中输入 hello 然后提交，也像这样警告名称 alert(name);查看 hello 是否是文本框的值

【解决方案3】：

您是否尝试过使用 CssClass 而不是 asp:Textbox 的 ID 并删除 javascript 中的冒号，像这样

$(".remarks").css("border", "1px solid red");
$(".remarks").css("background-color", "#FFCECE");

【讨论】：

是的，它来了，但不会持续更长的时间..，它只是眨眼和去...我该怎么做才能持续孤独的时间，直到我在其他部分删除它

【解决方案4】：

试试这个...

    <td   width="10%" class="td">
                    <asp:TextBox runat="server" ID="txtRemark" ClientIDMode="Static" TextMode="MultiLine" CssClass="remarks" ></asp:TextBox>
        </td>
        <asp:Button runat="server" ID="imgSubmit" Text="SUBMIT" OnClientClick="validate()" ClientIDMode="Static" />

       $("#imgSubmit").click(function () {

            var name = $("#<%= txtRemark.ClientID %>").val();
             if (name == "") {  
                 alert("Validation working");  
                $("[id$='<%= txtRemark.ClientID %>']").css({
                                  "border": "1px solid red",
                                  "background-color": "#FFCECE"
                 });

             }
             else {
                 alert("Welcome: " + name);
             }
return false;

         });

【讨论】：