功能：在div中添加链接

时间：2012-01-21 作者：Rob Pachasa

我希望创建一个函数，将添加到div的链接（或者用div和链接替换div-简单地说；我试图创建一个插件，将标题图像转换为无需代码编辑的可单击链接）。

也许我做错了，但我选择的道路是str\\u replace。我希望这样的事情能奏效：

$content = str_replace(\'<div class="header-object">\', \'<div class="header-object"><a href=”<?php bloginfo(‘siteurl’); ?>”></a>, \'<div class="header-object">\';

图像通过“header object”css类调用。这是整个div减去结束调用。这段代码甚至无法正常工作（甚至作为header.php代码编辑）。有什么想法吗？

1 个回复

SO网友:Jared

为什么不使用jQuery执行此操作？这将是一个非常简单的示例，前提是您有办法将博客的URL输入jQuery代码：

jQuery(document).ready(function(){
    jQuery(\'.header-object img\').wrap(\'<a href="#blog url here#"></a>\');
});

这将包装<a> 在.header-object 班

要在代码中实现这一点，请将其作为脚本运行，如下所示：

<script type="text/javascript">
jQuery(document).ready(function(){
    jQuery(\'.header-object img\').wrap(\'<a href="#blog url here#"></a>\');
});
</script>

你真的可以把它放在任何地方，但建议你把它放在<head> 标签如果你把它放在头标签中（而不是与wp_enqueue_script) 你可以使用<?php echo home_url(); ?> 代替#blog url here#.

这就是在PHP文件中<head> 标签您还需要包括jQuery，所以我添加了一个额外的<script> 为此，在运行任何jQuery时都绝对需要它（如果您的主题还没有加载jQuery，那就是！）：

(Read my edit below this code as well!)

<!DOCTYPE html>
<html>
<head>
    <title>Untitled Document</title>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
    <script type="text/javascript">
    jQuery(document).ready(function(){
        jQuery(\'.header-object img\').wrap(\'<a href="<?php echo home_url(); ?>"></a>\');
    });
    </script>

</head>

<body>

    <div class="header-object">
    <img src="" />
    </div>

</body>
</html>

EDIT

以上是帮助您理解的一个非常基本的示例，您需要做的是使用WP已经为您提供的内容。使用wp_enqueue_scripts 在您的functions.php 文件假设您使用的基本主题尚未将jQuery排队，并且没有插件将jQuery排队，那么下面的代码可以工作。

以包装图像的jQuery代码为例<a> 标记并将其放入名为anything.js 在您的主题文件夹中，在本例中themes/yourtheme/js/wrapheaderimg.js - 请注意<?php echo home_url(); ?> 不会在这里工作，因为它不是PHP文件。

第二次打开（如果不存在，则创建一个）functions.php 在主题的目录中，下面的代码应自动将所需的脚本添加到<head> 标签：

function my_enqueue_scripts(){
    // enqueue jQuery (already included in WP)
    wp_enqueue_script( \'jquery\' );

    // register and enqueue your custom .js file
    wp_register_script( \'wrapheaderimg\', get_bloginfo( \'template_url\' ) . \'/js/wrapheaderimg.js\' );
    wp_enqueue_script( \'wrapheaderimg\' );
}
add_action( \'wp_enqueue_scripts\', \'my_enqueue_scripts\' );

现在记住echo home_url(); 在那行不通。js文件，所以如果您只是为自己使用这个文件，假设URL总是相同的，您可以硬编码它，否则还有另一种方法，但是I don\'t know if it is best practices. 下面是：

当您将脚本排入functions.php 文件，文件扩展名不必是.js, 你能做到的.php 只要你的JS文件有.php 扩展名和文件顶部的相应标头：

<?php
header("content-type: application/x-javascript");
?>

然后再回来functions.php 您可以这样做，将博客的URL传递到Javascript文件：

/* functions.php */
function my_enqueue_scripts(){
    // enqueue jQuery (already registered in WP)
    wp_enqueue_script( \'jquery\' );

    // register and enqueue your custom .php Javascript file with blog URL as a paramater
    $blogurl = urlencode( get_bloginfo( \'template_url\' ) );
    wp_register_script( \'wrapheaderimg\', get_bloginfo( \'template_url\' ) . \'/js/wrapheaderimg.php?url=\' . $blogurl );
    wp_enqueue_script( \'wrapheaderimg\' );
}
add_action( \'wp_enqueue_scripts\', \'my_enqueue_scripts\' );

现在回到您的定制PHP Javascript文件中，您可以使用它访问该变量，基本上使用echo $_REQUEST[\'url\'];:

/* js/wrapheaderimg.php */
<?php
header("content-type: application/x-javascript");
$blogurl = urldecode( $_REQUEST[\'url\'] );
?>
jQuery(document).ready(function(){
    jQuery(\'.header-object img\').wrap(\'<a href="<?php echo $blogurl; ?>"></a>\');
});

希望这有帮助。

结束

小码农CODE

功能：在div中添加链接

相关推荐