2012-01-03 64 views
0

你好,我对JQuery来说很新。坐在桌子上有一个复选框。一旦我点击复选框弹出需要出现持有动态列表。我正在努力做到这一点。谁能帮忙?JQuery Fancy Box HOw将一个动态列表填充到一个I框架由花式框创建

<html> 
<head> 
<label align="center">Select a watch list </label> 
</head> 
<body> 
<select> 
    <option value="volvo">Volvo</option> 
    <option value="saab">Saab</option> 
    <option value="mercedes">Mercedes</option> 
    <option value="audi">Audi</option> 
    <option value="new">Add New</option> 
</select> 
</body> 
</html> 

$("a.watchlisttophundred").fancybox({'width' : 200,'height' : 400,'scrolling':'no','transitionIn': 'none','autoScale': false,'transitionOut': 'none','type': 'iframe'}); 

我想要做的花式框内嵌出现,我在表中选择的行

<table class="common_data_grid top20" cellpadding="0" cellspacing="0" width="100%"> 
<tr> 
    <th></th> 
    <th>URL <span class="view_report_text">&nbsp;(Click to View Report)</span></th> 
    <th>Watch List</th> 
    <th width="100">Total Hits</th> 
    <th width="350">Percentage of all Hits</th> 
</tr> 
    {% if top_twenty_urlentities %} 
    {% for top_twenty_url in top_twenty_urlentities %} 
<tr> 
    <td>{{loop.index}}</td> 
    {% if top_twenty_url.url_id.url|replace(domain_url, "")|count == 0 %} 
    <td><a class="tooltip" title="{{top_twenty_url.url_id.url}}" href="/tophundredviewreport/?key={{top_twenty_url.url_id.key()}}">{{top_twenty_url.url_id.url|replace(domain_url, "")|replace("", "/")|truncate(length=50, killwords=True, end='...')}}</a></td> 
    {% else %} 
    <td><a class="tooltip" title="{{top_twenty_url.url_id.url}}" href="/tophundredviewreport/?key={{top_twenty_url.url_id.key()}}">{{top_twenty_url.url_id.url|replace(domain_url, "")|truncate(length=50, killwords=True, end='...')}}</a></td> 
    {% endif %} 
    <td><a href="/watchlisttophundred" class="watchlisttophundred">watch</a></td> 
    <td align="right"><span class="total_hits" title="<div>Facebook Hits: {{top_twenty_url.facebook_count|format_number}} <br/> Twitter Hits: {{top_twenty_url.twitter_count|format_number}} <br/> Google+ Hits: {{top_twenty_url.buzz_count|format_number}} <br/> LinkedIn Hits: {{top_twenty_url.linkedin_count|format_number}} <br/> Digg Hits: {{top_twenty_url.digg_count|format_number}} <br/> Delicious Hits: {{top_twenty_url.delicious_count|format_number}} <br/> Reddit Hits: {{top_twenty_url.reddit_count|format_number}}</div>">{{top_twenty_url.total|format_number}}</span></td> 
    {% if top_twenty_url.total > 0 %} 
    <td class="progress_td" title="<div>Facebook Hits: {{(top_twenty_url.facebook_count/top_twenty_url.total*100)|round(2)}}% <br/> Twitter Hits: {{(top_twenty_url.twitter_count/top_twenty_url.total*100)|round(2)}}% <br/> Google+ Hits: {{(top_twenty_url.buzz_count/top_twenty_url.total*100)|round(2)}}% <br/> LinkedIn Hits: {{(top_twenty_url.linkedin_count/top_twenty_url.total*100)|round(2)}}% <br/> Digg Hits: {{(top_twenty_url.digg_count/top_twenty_url.total*100)|round(2)}}% <br/> Delicious Hits: {{(top_twenty_url.delicious_count/top_twenty_url.total*100)|round(2)}}% <br/> Reddit Hits: {{(top_twenty_url.reddit_count/top_twenty_url.total*100)|round(2)}}%</div>"><div class="progress">{{(top_twenty_url.total/top_twenty_url.sum_total*100)|round(2)}}</div></td> 
    {% else %} 
    <td><div class="progress">{{(top_twenty_url.total/top_twenty_url.sum_total*100)|round(2)}}</div></td> 
    {% endif %} 
</tr> 
    {%endfor%} 
    {% endif %} 

</table> 
+0

!ianace我包括我迄今为止所做的事情 – 2012-01-03 06:57:04

回答

1

您可以手动调用的fancybox这样

$("#checkbox_id").click(function() { 
    $.fancybox({ 
     'width'  : 680, 
     'height'  : 495, 
     'href'   : 'http://blahblah.com', 
     'type'   : 'iframe' 
    }); 
    return false; 
}); 
相关问题