Recently on Self-Study Java Web Foundation, builds own page time to use the boostrap JS Library . Since no prior contact with jquery, so used to stumble, so here to simply remember the boostrap I used in some of the JS plug-in usage.
The first one to use is the popover plug-in in Boostrap . The reason is that a simple registration interface needs to verify that the user name is legitimate, whether it has been registered, the password is legitimate, re-enter the password and before the password matching, etc., need to use PopOver to carry out information warning.
First, a simple example:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
|
<divclass= "container" style= "padding:100px 50px 10px;" >
<buttontype= "button" id= "Button1" class= "btn btn-default"
&nbs P; data-container= "Body" data-toggle= "popover" >
left PopOver
& Nbsp;</button>
</div>
<script> /div>
$ (function () {
$ (' #button1 '). PopOver ({
trigg ER: ' Click ',
title: ' test1 ',
placement: ' Right ',
content: ' Hello '
};
});
</script>
|
You can see that when using APIs for PopOver programming, be sure to reference $ (' #element '). PopOver () PopOver Activate a control that id= "element". Before the direct copy of the official online code, found that after the click can not trigger, has been very confused. Then using name= "element" is not able to activate the popover.
If you need to add a popover effect to the input box, you need only trigger= ' Focus ' . However, it does not seem to support blur, and it is not possible to determine whether the contents of the input box are legitimate and trigger popover after blur. This will need to be followed by further study.