Home > Web Front-end > JS Tutorial > jquery lost focus event blur sample code sharing

jquery lost focus event blur sample code sharing

黄舟
Release: 2017-06-26 14:13:07
Original
2053 people have browsed it

Losing focus in jquery Event We only need to use blur to bind, so that we can monitor the blur action of the input box in real time.

A supervisor text event

$(function () {
$(':text').blur(function () {
if ($.trim($(this).val())=='') {
$(this).css('border', 'red');
} else {
$(this).css('border','white');
}
});
});
Copy after login

Instance

<script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>
    <script language="javascript" type="text/javascript">
 //失去焦点时判断(一个公用的方法,在文本框里写事件调用这个方法)
        function OnFousFun(element1, element2, text) {
            if ($(element1).val() == "" || $(element1).val() == text) {//输入框里值为空,或者为一些特定的文字时,都提示输入不能为空
                $(element2).html("输入不能为空");
                return false;
            }
            else {
                $(element2).html("");
                return true;
            }
        }
</script>
Copy after login

Page code

<tr>
                <th>
                    校长证件号码</th>
                <td>
                    <asp:TextBox ID="txtCardID" runat="server" CssClass="formbox" TabIndex="1" MaxLength="50"
                       Text=&#39;15位或18位&#39; onblur="OnFousFun(&#39;#ContentPlaceHolder1_txtCardID&#39;,&#39;#ContentPlaceHolder1_Label1&#39;,&#39;15位或18位&#39;)">
                       </asp:TextBox>
                    <asp:Label ID="Label1" runat="server" ForeColor="Red"></asp:Label>
                </td>
            </tr>
Copy after login

Description: onblur is an event when the text box loses focus

The above is the detailed content of jquery lost focus event blur sample code sharing. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template