将 innerhtml 添加到顶部链接

Posted 2023-05-07

【中文标题】将 innerhtml 添加到顶部链接

【英文标题】：Add innerhtml to top links

【发布时间】：2012-11-23 09:45:12

【问题描述】：

我正在尝试向 Magento 的顶部链接添加一个小的 innerhtml 函数。我隐藏了文本（“我的帐户”、“我的愿望清单”、“我的购物车”、“登录/注册”），而不是默认的文本链接，并为它们提供了图像。

见下图。

我想要做的是，当您将鼠标悬停在某个顶部链接按钮上时，您会在按钮旁边的 div 中某处获得该顶部链接的相应标签/名称。因此，如果您将鼠标悬停在“我的购物车”链接/按钮上，您会在相应的 div 中看到“我的购物车”文本。

技术问题不是innerhtml 部分，因为我知道innerhtml 是如何工作的。我的问题是：我在哪里以及如何实现 innerhtml 代码，以便它对所有 4 个***链接都正常工作？

（基本上，将这些文本链接制作成图片链接并不重要，但这样你就不会问自己“他为什么要这样做？”。）

---

我尝试将这些部分添加到

mystore\app\design\frontend\base\default\template\page\template\links.phtml

或（从不同时）

mystore\app\design\frontend\base\default\template\page\template\linksblock.phtml。 我使用了以下代码片段：

<script type="text/javascript"> function changeDescription(content) document.getElementById('description').innerHTML = content; </script>

<a href="#" onmouseover="changeDescription('<?php echo $this->getTitle() ?>')"> <!-- I also tried getLabel() instead of getTitle() -->

<div id="description"> lorem ipsum </div>

并尝试在这些文件中的不同位置（单独）放置，但无论我放置代码，它都会弄乱<ul> 列表及其列表项。

---

附言我知道，这些“按钮”很丑陋。这只是暂时的；）

---

编辑：

我最好的尝试（在其他不同的事情中）可能是把它放在 links.phtml 中，如下所示：

<script type="text/javascript"> function changeDescription(content)  document.getElementById('description').innerHTML = content;  </script>
<div id="description"> lorem ipsum </div>
<?php $_links = $this->getLinks(); ?>
<?php if(count($_links)>0): ?>
<ul class="links"<?php if($this->getName()): ?> id="<?php echo $this->getName() ?>"<?php endif;?>>
    <?php foreach($_links as $_link): ?>
    <a href="#" title="<?php echo htmlspecialchars($this->getLabel()); ?>" onmouseover="changeDescription(this.title)">
        <?php if ($_link instanceof Mage_Core_Block_Abstract):?>
            <?php echo $_link->toHtml() ?>
        <?php else: ?>
            <li<?php if($_link->getIsFirst()||$_link->getIsLast()): ?> class="<?php if($_link->getIsFirst()): ?>first<?php endif; ?><?php if($_link->getIsLast()): ?> last<?php endif; ?>"<?php endif; ?> <?php echo $_link->getLiParams() ?>><?php echo $_link->getBeforeText() ?><a href="<?php echo $_link->getUrl() ?>" title="<?php echo $_link->getTitle() ?>" <?php echo $_link->getAParams() ?>><?php echo $_link->getLabel() ?></a><?php echo $_link->getAfterText() ?></li>
       <?php endif;?>
       </a>
    <?php endforeach; ?>
</ul>
<?php endif; ?>

但无济于事。无论我做什么，都会弄乱<ul> 的内容结构。

【参考方案1】：

为什么不简单：

<a href="#"
    title="<?php echo htmlspecialchars($this->getTitle()); ?>"
    onmouseover="changeDescription(this.title)">
...</a>

请注意，您的 changeDescription 函数中的 content 和 inhoud 不匹配。

【讨论】：

哦，是的，'inhoud' 是荷兰语的'内容'，我忘了在这里更改，但我实际使用的代码没有不匹配；）我会编辑问题

到目前为止仍然没有运气，我只是无法弄清楚将代码片段放在哪里。请参阅我的问题中的更新。