Question

以下是这种情况：

这是一个银行网站，所以当用户点击外部链接（可能是Facebook页面或合作伙伴网站）时，需要有一个框说“＃34;你即将离开这个页面，此内容均不由......等管理。＆＃34;。
然后，用户应该可以点击确认＆＃39;在新窗口中打开外部链接或点击“取消”＃39;被带回网站和一个框说'＃34;你选择不离开网站＆＃34;。

此网站位于Wordpress中，因此我正在寻找一种简单的方法来处理此问题，而无需为每个链接添加自定义Javascript。

他们确实让它在现有网站上运行：http://clearmountainbank.com/我可以通过在标题中添加confirm_entry脚本并为每个链接添加自定义Javascript来使其在新网站上运行但我无法做到获取在新窗口中打开的链接。

这种方式也很耗时，因为我必须手动编辑每个外部链接。是否有任何简单的方法来识别外部链接并在整个网站中添加此功能，如果没有，我该怎么做才能在新窗口中打开它？

以下是我使用的代码：

    <script type="text/javascript">
        <!--
            function confirm_entry(varible_value)
            {
            input_box=confirm("Link Disclaimer:  Bank Name  provides links to web pages which are not part of the Bank Name website or clearmountainbank.com or online.bankname.com domains. These sites are not under Bank Name control, and Clear Mountain Bank is not responsible for the information or links you may find there. Bank Name is providing these links only as a convenience. The presence of these links on any Bank Name website is not intended to imply Bank Name endorsement of that site, but to provide a convenient link to relevant sites which are managed by other organizations, companies, or individuals.");
            if (input_box==true)

            { 
            window.location.href=varible_value; 
            }

            else
            {
            // Output when Cancel is clicked
            alert ("You have opted not to leave Bank's website.");
            }

            }
        -->
    </script>

Answer 1

这是你可以做到的一种方式(See JSFiddle)：

$("a").on("click", function() {
    if($(this).attr("href").indexOf("http://") == 0) {
        return confirm("Super long message");
    }
});

这只适用于http://而非https://，它也不会检查绝对链接是否指向您当前的域名，但它会告诉您如何处理它

Answer 2

我无法让confirm()工作。但是，多亏了以下Q＆amp; A，我做了另一种选择：

您可以在主题functions.php中应用代码，但最好是make a plugin for that。

add_action( 'wp_enqueue_scripts', 'enqueue_scripts_so_22382151' );
add_action( 'wp_header', 'print_header_so_22382151' );
add_action( 'wp_footer', 'print_footer_so_22382151' );

/**
 * Enqueue jQuery Dialog and its dependencies
 * Enqueue jQuery UI theme from Google CDN
 */
function enqueue_scripts_so_22382151() {
    wp_enqueue_script( 'jquery-ui-dialog', false, array('jquery-ui','jquery') );
    wp_enqueue_style( 'jquery-ui-cdn', 'http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/dot-luv/jquery-ui.min.css' );
}    


/**
 * Print Dialog custom style
 */
function print_header_so_22382151() { 
    ?>
    <style>
        /* A class used by the jQuery UI CSS framework for their dialogs. */
        .ui-front {
            z-index:1000000 !important; /* The default is 100. !important overrides the default. */
        }
        .ui-widget-overlay {
            opacity: .8;
        }
    </style>
    <?php
}

/**
 * Print Dialog script
 */
function print_footer_so_22382151() { 
    $current_domain = $_SERVER['SERVER_NAME'];
    ?>
    <script type="text/javascript">
        jQuery(document).ready(function ($) {
          $('a[href^="http://"],a[href^="https://"]')
            .not('[href*="<?php echo $current_domain; ?>"]')
            .click(function(e) {
                e.preventDefault();
                var url = this.href;
                $('<div></div>').appendTo('body')
                    .html('<div><h6>Link Disclaimer:  [...].</h6></div>')
                    .dialog({
                        modal: true, title: 'message', zIndex: 10000, autoOpen: true,
                        width: 'auto', resizable: false,
                        buttons: {
                            Yes: function () {
                                window.open(url);
                                $(this).dialog("close");
                            },
                            No: function () {
                                $(this).dialog("close");
                            }
                        },
                        close: function (event, ui) {
                            $(this).remove();
                        }
                    });
            })
        });
    </script>
    <?php 
}

确认在Wordpress中保留外部链接

2 个答案: