How do I move inline-javascript to script tags?

Question

So I've got this popover which is working good, here is the html of the popover:

<div class="popover2"  onmouseover="$(this).mouseleave(function() {$(this).hide(); });">
    <div class="arrow"></div>
    <div class="popover2-inner">
        <span class="popover2-title">Popover() 2</span>
    <div class="popover2-content">
        <ul class="unstyled">
            <li><span>$200 Bronze</span><p>2 hrs. drivers training</p </li>
        </ul>
    </div>
</div>

And I've got this instantiation code:

    $('.popover2-test').popover({
    placement:'bottom',
    template: $('.popover2'),
    trigger: 'manual',
    animate: false,
    html: true,

        }).click(function(e) {
            e.preventDefault() ;
        }).mouseenter(function(e) {
            $(this).popover('show');
    });

But I want to move the inline onmouseover javascript stuff into the instantiation code. I don't know how to do this. Any help is great, thanks.

Give the tag an id and then just bind the event in JS. Unless that is the only tag with that class, in which case you can simply use the class. — TheZ
– TheZ, Commented Jul 3, 2012 at 21:44
Your going to have to be more specific, I don't know what your talking about, sorry and thanks! — dezman
– dezman, Commented Jul 3, 2012 at 21:45

Renato Gama · Accepted Answer · 2012-07-03 21:46:05Z

4

Have you tried placing this line of code just after the instantiation code?

$('.popover2').mouseleave(function() { $(this).hide(); });

answered Jul 3, 2012 at 21:46

Renato Gama

16.6k12 gold badges64 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Roko C. Buljan · Accepted Answer · 2012-07-03 21:46:15Z

2

just remove the inline and add:

$('.popover2').mouseleave(function(){
    $(this).hide();
});

answered Jul 3, 2012 at 21:46

Roko C. Buljan

209k41 gold badges335 silver badges346 bronze badges

Comments

Cameron Martin · Accepted Answer · 2012-07-03 21:49:14Z

2

There's no point only binding the mouseleave event onmouseover, since a mouseover event must fire before mouseleave anyway (AFAIK). So this would do:

$('.popover2').mouseleave(function() {
    $(this).hide();
});

This assumes, of course, that .popover2 exists when your 'instantiation code' runs.

If not,

$('.popover2').live('mouseleave', function() {
    $(this).hide();
});

answered Jul 3, 2012 at 21:49

Cameron Martin

6,0102 gold badges45 silver badges55 bronze badges

Collectives™ on Stack Overflow

How do I move inline-javascript to script tags?

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related