Question

我想知道如何在文本框焦点结束后以编程方式在验证消息之间进行交换。

我有这个标记：

  <div class="form-group" style="width: 100%;" id="divFirstName" runat="server">
                                        <input type="text" placeholder="Student First Name" runat="server" id="txtFirstName" clientidmode="Static" value="" class="form-control" maxlength="30" />
                                        <span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true" id="tt2" clientidmode="Static" runat="server" Visible="False"></span>
                                    <span id="inputSuccess2Status" runat="server" clientidmode="Static" Visible="False" class="sr-only">(success)</span>
                                    <span class="glyphicon glyphicon-remove form-control-feedback" Visible="False" runat="server" aria-hidden="true"></span>
                                    <span id="inputError2Status" class="sr-only" runat="server" Visible="False">(error)</span>
                                    </div>

然后我有这个脚本以防文本框中有值：

 $(this).attr("aria-describedby", "inputSuccess2Status");
                $("#tt2").attr("visibility", "visible");
                $("#inputSuccess2Status").attr("visibility", "visible");

执行脚本后不会显示字形。

你知道有什么不对吗？我在这里做了些什么吗？我只想做的是焦点在控制之外，如果有值显示glyphicon-ok否则显示glyphicon-remove。

Answer 1

这就是我们正在寻找的东西吗？

<强> HTML

<div class="form-group has-feedback" style="width: 100%;" id="divFirstName" runat="server">
    <input type="text" placeholder="Student First Name" runat="server" id="txtFirstName" clientidmode="Static" value="" class="form-control" maxlength="30" />    
</div>`

<强> Jquery的

$('#txtFirstName').change(function(){
    $('.form-control-feedback').remove();
    if($(this).val().length > 0){        
        $('#divFirstName').append('<span class="glyphicon glyphicon-ok form-control-feedback" aria-hidden="true" id="tt2" clientidmode="Static" runat="server" Visible="False"></span>');
    }else{
        $('#divFirstName').append('<span class="glyphicon glyphicon-remove form-control-feedback" aria-hidden="true" id="tt2" clientidmode="Static" runat="server" Visible="False"></span>');
   }
});

实时预览

jsFiddle Example

使用jQuery显示引导程序验证图标

1 个答案: