如何根据我单击的菜单按钮更改图像的路径

Question

我有一个菜单，其中每个部分显示不同的画廊图像。 因此，我必须知道我单击了菜单中的哪个按钮，因为根据该按钮，我必须更改图像路径。

<div id="tabcontainer">
  <ul id="tabnav">
    <li><a href="#tabs-1">Monuments</a></li>
    <li><a href="#tabs-2">Bridges</a></li>
    <li><a href="#tabs-3">Gardens</a></li>

例如，如果单击“纪念碑”，则必须加载纪念碑图像；如果单击“花园”，则必须加载花园图像。

我总是使用$ path变量，并且每次都想给它分配一个不同的路径。

编辑：

我有3个路径变量， $path_monumets ， $path_bridges和$path_gardens但是最后我使用变量$path ，只有$path 。 根据我单击菜单的按钮，我希望$path的值更改为$path=$path_brige或$path=$path_garden等。

有人可以帮助我吗？ 也许我的问题很简单，但我找不到如何在互联网上进行操作。

谢谢

编辑2

我写了funcion setPath（我知道返回相同的值，但是我想使用一个函数）：

<?php
function setPath($new_path)
{
return new_path;
}
?>

我更改了菜单：

    <li><a href="#tabs-1" onclick="$path=setPath('<? echo $path_monuments; ?>')">Monuments</a></li>
    <li><a href="#tabs-2" onclick="$path=setPath('<? echo $path_bridges; ?>')">Bridges</a></li>
    <li><a href="#tabs-3" onclick="$path=setPath('<? echo $path_gardens; ?>')">Gardens</a></li>

但是即使这样，可变路径也不会改变她的价值。 有人可以帮我吗？

Answer 1

您也可以只将事件移到JavaScript上，这样就根本不必修改标记。

...
myTabs[i].addEventListener( 'click', function(e) {
...

请参见此JSFiddle中的代码示例。

Answer 2

您可以做的是将路径附加到相应的链接：

<div id="tabcontainer">
  <ul id="tabnav">
    <li><a href="#tabs-1" onclick="setPath('<? echo $path1; ?>')">Monuments</a></li>
    <li><a href="#tabs-2" onclick="setPath('<? echo $path2; ?>')">Bridges</a></li>
    <li><a href="#tabs-3" onclick="setPath('<? echo $path3; ?>')">Gardens</a></li>

因此，您将获得单击时每个链接的路径。 那是你要的吗？