开发者

JQuery Bubble Popup: innerhtml hidden div

I'm using the JQuery Bubble Popup library, trying to show a hidden div in the innerHtml variable. Right now I have this:

<div class="button"> Show stuff </div>
<div class="information"> foo </div>

<div class="button"> Show stuff </div>
<div class="information"> bar </div>

<script>
$(document).ready(function(){
        $('.information').hide();
        $('.button').CreateBubblePopup({
                                        position: 'bottom',
                                        align: 'center',
                                        width: '300',
                                        innerHtml: $(this).next(".information").html(),
                                        innerHtmlStyle: { color:'#000', '开发者_如何学编程text-align':'left', 'font-size':'110%' },
                                        themeName: 'grey',
                                        themePath: '/static/images/jquerybubblepopup-theme',
                                        selectable: true,
                                      });
        });


</script>

The thing is, it isn't working as I expected, the problem is in the line

innerHtml: $(this).next(".information").html(),

Because if I put this it works:

innerHtml: 'testing jquery bubblepopup',


The problem with this line:

  innerHtml: $(this).next(".information").html(),

is that this is not referring to what you think it refers to. I think you want it to refer to the current button being affected, but it doesn't - it's the this value that's in effect in the "ready" handler context.

What you can do (among several things) is use the ".each()" function:

$('.button').each(function() {
  $(this).CreateBubblePopup({
    position: 'bottom',
    align: 'center',
    width: '300',
    innerHtml: $(this).next(".information").html(),
    innerHtmlStyle: { color:'#000', 'text-align':'left', 'font-size':'110%' },
    themeName: 'grey',
    themePath: '/static/images/jquerybubblepopup-theme',
    selectable: true
   });
 });

Also you've got a stray comma at the end of the bubble popup parameter object, which will get you an error from IE.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜