Question

当我点击文本框中显示jbox.js工具提示时，我希望当文本框聚焦工具提示显示时以及未聚焦工具提示隐藏时。

脚本：

<script type="text/javascript">
$(document).ready(function() {
    $('.tooltip').jBox('Tooltip', {
        trigger: 'click',
        position: {
            x: 'right',
            y: 'center'
        },
        outside: 'x'
    });
});
</script>

HTML标记：

<input type="text" class="tooltip" autofocus placeholder="First" id="fname" title="Your First Name in Latin" />
<input type="text" class="tooltip" placeholder="Last" id="lname" title="Your Last Name in Latin" />
<span class="lbl">Choose your username</span>
<input type="text" class="tooltip" id="uname" title="You Can Use letters, numbers, dots" />
<span class="lbl lbl_no">Username can't leave this empty.</span>

Answer 1

您将在JQuery中使用焦点和模糊功能。您的需求代码是：

   <script type='text/javascript'>
    $(document).ready(function() {
        var x = $('.tooltip').jBox('Tooltip', {
            trigger: 'focus',
            animation:{open: 'tada', close: 'flip'},
            position:{
             x:'right',
             y:'center'   
            }, outside:'x'
        });
        $('.tooltip').blur(function() {
            x.close();
        });
    });
</script>

jBox.js工具提示显示在文本框上聚焦并隐藏在无可争议的

1 个答案: