How can I found the trigger codes if there is a button which can do an event but it seems like has no set event handler? For example widget toolbox buttons in bootsrap templates. The buttons have just a class but they are working well.
<a href="javascript:;" class="collapse" data-original-title="" title=""></a> Where are the codes of this collapse function?
2 Answers
Answers 1
The actual code to animate the collapse is in this scss collapse transition
.collapse { &:not(.show) { display: none; } } .collapsing { position: relative; height: 0; overflow: hidden; @include transition($transition-collapse); } ...and the actual transition is set here.
There is javascript that toggles the class states between the following states as documented here:
.collapse- Closed state of the "dropdown" component and the query to know what elements to apply collapse toggle logic to..collapsing- Interim state between closed and open in which the css transition is applied..collapse.show- Open state of the "dropdown"
I assume that javascript logic is here for showing the "dropdown" when the [data-toggle]=collapse element is clicked in open state. Then the logic for hiding the "dropdown" is here. The show/hide logic is only toggling the css classes to correspond to the states above, which then triggers the css transition above.
Notice the toggle of class on the "dropdown" between clicks
Answers 2
As @A. Wolff said, the default action of a button is to submit a form, which will lead you to another web page, specified on that form.
Have a look at the form element described at W3Schools, you can basically reach the same behaviour using the button element.
If you want to inspect what events are attached to your button, you can right click it and see the elements inspector.
If there are no events attached then nothing will be shown, also, if this button belongs to a form, the default action is not considered as a Javascript Event.
If you want to remove all listeners maybe you should take a look to this answer
0 comments:
Post a Comment