javascript - 图像映射区域元素上的 Onclick 事件

Question

我遇到以下问题。我有一个大图像(横幅)，上面有两个标志，分别是 2 个 map 区域。我想要执行以下操作:当您单击英语国旗时，语言更改为英语，当您单击西类牙国旗时，语言更改为西类牙语。我不知道是否应该使用 href 或 onclick 函数来完成此操作。我添加了一些代码。

<img src="banner_trading_1440_x_176_esp.jpg"   usemap="#planetmap">
<map name="planetmap">
 <area shape="rect" coords="1318,14,1346,32" alt="Eng"  href="javascript:window.location.href='<?php echo base_url(); ?> LanguageSwitcher/switchLang/spanish';" >
 <area shape="rect" coords="1276,14,1303,32" alt="Esp" onclick="javascript:window.location.href='<?php echo base_url(); ?> LanguageSwitcher/switchLang/spanish';"/>
</map>

之前，我将两个标志作为两个单独的图像，并且代码如下(并且运行完美):

  <img style="width: 30px; cursor: pointer; padding-top: 15px; padding-bottom: 15px;" src="http://www.hemptrading.com/tienda3/asserts/img/spain.png" onclick="javascript:window.location.href='<?php echo base_url(); ?> LanguageSwitcher/switchLang/spanish';"/> 

Answer 1

您应该从区域标记调用 JavaScript 函数，并将您的 php 代码放入该函数定义中

<area shape="rect" coords="1318,14,1346,32" alt="Eng" href="javascript:your_function();" >

并添加此功能的php代码

<script>
function your_function() {
window.location.href='<?php echo base_url(); ?> LanguageSwitcher/switchLang/spanish';
}
</script>