Question

我管理一个我没有构建的网站。该网站提供了一些链接，您可以在其中单击该链接，并打开一个模式窗口，其中包含来自不同html文件的内容。它曾经工作，现在它没有。

我已经比较了现在和我接管网站之间的所有相关文件，但没有看到任何可能会影响这一点的更改。

这样就会调用弹出窗口：

<?php bioLinkText('Daniel Jones', 'Read more about Dr. Jones'); ?></p>

它应该打开的页面是/bios/daniel-jones.html

来自functions.php文件：

function bioLinkText($name,$text) {
$name = strtolower(str_replace(" ","-",$name));
echo '<a href="/bios/'.$name.'.html" class="popUp">'.$text.'</a>';}

这部分功能正常。但它曾用于创建模态窗口，现在，它只是像常规链接一样打开链接。

来自global.js文件：

 // AJAX Popups
    function popUp(page,randId) {
        $('body').append(
        '<div id="'+randId+'" class="pWin" style="display:none;position:fixed">'+
            '<span class="pHead">'+
                '<a href="'+page+'" target="_blank">Open in new window</a>'+
                '<span class="pClose">X</span>'+
            '</span>'+
            '<div class="pBod"></div>'+
        '</div>'
        );

        var top = (h/2) - 150;
        var left = (w/2) - 300;

        $('#'+randId+'.pWin').addClass('large').css({top:top+'px',left:left+'px'});
        $('#'+randId+' .pBod').html('<img src="/images/loading.gif" alt="loading"/>').load(page+' #content', function() {
            $('.pWin').show(300);
            $('.pBod #content').find('img').filter('#portrait').attr('src', function(index, src) {
                return '/bios/' + src;
            });
        });

    }

    $('.popUp').click(function() {
        var randId = randomString();
        var num = $('.pWin').length;
        if (num < 5) {
            var page = $(this).attr('href');
            popUp(page,randId);
            $('#'+randId+'.pWin').draggable({handle:'.pHead'}).resizable({alsoResize:'#'+randId+' .pBod', minWidth: 320, minHeight: 280, maxWidth: 800, maxHeight: 600});
        }
        return false;

    });

    function pClose(btn) {
        var pWin = btn.closest('.pWin');
        pWin.hide(200, function() { pWin.remove(); });
    }
    $('.pClose').live('click',function() {
        var btn = $(this);
        pClose(btn);
    });
    $(document).keyup(function(e) {
      if (e.keyCode == 27) {
            $('.pWin').hide(200, function() { $('.pWin').remove(); });
      }
    });

来自style.css文件：

.popUp, .pHead a { padding-right: 16px; background: url(/images/external.gif) 100% 50% no-repeat; }

.popUp.noBg { background:none; padding-right:0; }

我一直在努力解决这个问题超过10个小时。任何帮助将不胜感激。一件事是......我不明白如何调用javascript函数popUp。这是缺少的成分吗？

Answer 1

试试这个：

//Make sure the DOM is ready (If you call this function before '.popUp' exists, it wont be matched, and the '.click' handler wont be added.
$(document).ready(function() {

    $('.popUp').click(function(e) {
        //Prevent the default action (Clicking the button)
        e.preventDefault();
        //..Your code here
    });
});

Answer 2

好吧，我明白了。我改变了功能，添加了onclick =＆＃34; popup（）＆＃34;属性为a href，现在可以工作：

function bioLinkText($name,$text) {
$name = strtolower(str_replace(" ","-",$name));
echo '<a href="/bios/'.$name.'.html" onclick="popup()" class="popUp">'.$text.'</a>';

}

Javascript弹出窗口无法正常工作

2 个答案: