Question

我希望整个表格行可以点击棋盘游戏的弹出窗口。

我去了http://thephuse.com/design-and-usability/clickable-table-rows-with-jquery/，它告诉我添加并添加：

<!-- make entire <tr> clickable-->
<script>
jQuery( function($) {$('tbody tr[data-href]').addClass('clickable').click(
function(){window.location = $(this).attr('data-href');}).find('a').hover(
function() {$(this).parents('tr').unbind('click');},
function() {$(this).parents('tr').click( function()
{window.location = $(this).attr('data-href');});});});
</script>

但这导致了全屏浏览器窗口。我想要一个像这个脚本创建的居中弹出窗口：

<!--popup centered window-->
<script>function PopupCenter(pageURL, title,w,h)
{var left = (screen.width/2)-(w/2);
var top = (screen.height/2)-(h/2);
var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);} </script>

是的，我试过

<tr class="PopupCenter" data-href="http://google.com">

但是生成的弹出窗口仍然全屏;正如你在游戏桌上看到的那样 http://chesstao.com/test-2.php

未应用PopupCenter类。

我该怎么办？

添加：

<tr onclick="PopupCenter('games/$game', 'myPop1',400,400);"> dw

我正在尝试另一种解决方案，但这个也有一个有趣的错误。这次我在http://chesstao.com/test-2.php的照片下使用了摄影师信用的弹出代码我想点击a上的任意位置并显示弹出窗口。

可点击代码：

<script>
jQuery( function($) {$('tbody tr[data-href]').addClass('clickable').click(
function(){temp($(this).attr('data-href');}).find('a').hover(
function() {$(this).parents('tr').unbind('click');},
function() {$(this).parents('tr').click( function()
{temp($(this).attr('data-href');});});});
</script>

<!--Another Pop-up for diagram--> 
<script src="js/jquery.popupWindow-min.js" ></script>
<script>$('.diagram-popup').popupWindow({height:500, width:800}); </script>

和HTML：

<tr class="gradeA" data-href="games/BG-1001.php" ><td>07/17/1998</td><td>EU-ch U12</td>
<td>Mureck</td><td>0000</td><td>Khramiankov, Yuri</td><td>B99
</td><td style="display:none;visibility:hidden;">games/BG-1001.php</td></tr>

Answer 1

替换

window.location = $(this).attr('data-href');

带

PopupCenter($(this).attr('data-href'), "Some Title", 100, 100);

或任何你想要的大小窗口

注意：您需要在脚本中的某处定义PopupCenter才能使用它。

完整的答案是这样的：

<script type="text/javascript">
jQuery(function($) {
    $('tbody tr[data-href]').addClass('clickable').click(
        function(){
            PopupCenter($(this).attr('data-href'), 'title', 100, 100)
        }
    ).find('a').hover(
        function() {
            $(this).parents('tr').unbind('click');
        },
        function() {
            $(this).parents('tr').click( 
                function() {
                    PopupCenter($(this).attr('data-href'), 'title', 100, 100);
                }
            );
        }
    );
});

function PopupCenter(pageURL, title,w,h) {
    var left = (screen.width/2)-(w/2);
    var top = (screen.height/2)-(h/2);
    var targetWin = window.open (pageURL, title, 'toolbar=no, location=no, ' + 
        'directories=no, status=no, menubar=no, scrollbars=no, resizable=no, ' + 
        'copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
}

</script>

您需要提供标题以及正确的高度和宽度值。但我认为基本上就是这样。

popupCentered链接来自整个全屏显示。我想要一个较小的弹出窗口？

1 个答案: