2

我有一个相对于背景图像设置的图像。我想在点击时调用一个函数,但我似乎遇到了一个问题。超链接似乎正在工作,但没有调用该函数。这就是我的代码的样子

<img src=".."  width="100%" height="80"   id="ril_logo"/>
     <div id="logo-wrapper1">
    <img src="..."  width="5%" height="45"/>
     </div>
     <div id="logo-wrapper2">
    <a href="#">
            <img id="charger" onclick="abc();"  src=".."  width="4%" height="50" /> 
    </a>
     </div>



function abc()
{
        alert();
}
4

4 回答 4

3

您是否 100% 确定对 abc() 的调用不起作用?控制台日志中是否有任何错误。

你也可以考虑事件冒泡。您单击图像,它会触发它的事件。然后它冒泡到 a href 元素,然后冒泡到下一个可用元素等等。

您的代码可以更改为:

<img id="charger" onclick="abc(); return false;" src=".." width="4%" height="50" />

或者

<img id="charger" onclick="return abc();" src=".." width="4%" height="50" />
function abc() { ... return false; }

这将防止事件比 img onclick 函数进一步冒泡。

于 2013-10-19T10:10:08.710 回答
1

由于您img位于a标签内,因此单击图像会导致单击a,因此您会看到超链接正常工作。

如果您改为将 onclick 放在a它上面,则会触发函数调用。

于 2013-10-19T09:49:46.637 回答
0

只需添加您的function abc()内部脚本标签

<script type="text/javascript">
    function abc() {
        alert("Success");
    }
</script>
于 2013-10-19T10:01:31.553 回答
0

试试这个,并src="imagepath"添加你的图像路径

<img src=".." width="100%" height="80" id="ril_logo" />
<div id="logo-wrapper1">
    <img src="..." width="5%" height="45" />
</div>
<div id="logo-wrapper2">
    <a href="#">
        <img id="charger" onclick="abc();" src=".." width="4%" height="50" />
    </a>
</div>
<script type="text/javascript">

    function abc() {
        alert();
    }
</script>
于 2013-10-19T09:49:16.650 回答