0

以下 onClick 代码仅适用于 Chrome。在 Opera 和 Firefox 中，该按钮仅在单击时隐藏而不打开链接。

 <div>
    <button>
    <a  onClick="window.open('http://www.google.ro', 'sharer',
       'toolbar=0,status=0,width=500,height=325');" 
       href="javascript: void(0)"><img src=""/></a>
    </button>
</div>

JavaScript：

<script type='text/javascript'>//<![CDATA[ 
$(function(){
$("button").click(function() {
    $(this).parent().hide();

})
});//]]>

JSFiddle 链接

我该如何解决这个问题？

4

9 回答 9

5

该a元素在一个元素中是被禁止的button。

来自W3.org 上的按钮元素：

不得有交互式内容后代。

交互内容在此处描述。a列在其中。

这个想法是按钮处理交互。这就是为什么允许浏览器不让后代接收事件的原因。

button在您的情况下，您只需绑定元素上的窗口打开操作。

于 2013-03-22T11:25:10.507 回答
1

删除<a>并直接绑定onClick到<button>.

于 2013-03-22T11:24:24.043 回答
1

你不需要额外的标记..试试这个

也看看dystroy给出的优秀答案

<img data-href="http://www.google.ro" src="http://cdn1.iconfinder.com/data/icons/Futurosoft%20Icons%200.5.2/128x128/apps/vlc.png"/>

<script type='text/javascript'>
  $(function(){
    $("img").click(function() {
      $(this).hide();
      window.open($(this).attr('data-href'), 'sharer', 'toolbar=0,status=0,width=500,height=325');
    });
  });
 </script>

小提琴

于 2013-03-22T11:24:49.163 回答
1

为什么不把 open 方法放在 click 函数中呢？

$("button").click(function() {
    $(this).parent().hide();
    window.open('http://www.google.ro', 'sharer', 'toolbar=0,status=0,width=500,height=325');
})

当你在那里时，摆脱它<a>（见dystroy的回答）：

<div>
    <button>
        <img src="http://cdn1.iconfinder.com/data/icons/Futurosoft%20Icons%200.5.2/128x128/apps/vlc.png"/>
    </button>
</div>

小提琴

于 2013-03-22T11:25:16.270 回答
0

这不是我的想法，但试试这个：

<div><input type="button"><a  onClick="window.open('http://www.google.ro', 'sharer', 'toolbar=0,status=0,width=500,height=325');" href="javascript: void(0)"><img src=""/></a></input></div>
于 2013-03-22T11:23:25.480 回答
0

这是不好<a>的<button> 

<button>
  <a  onClick="window.open('http://www.google.ro', 'sharer', 'toolbar=0,status=0,width=500,height=325');" href="javascript: void(0)"><img src=""/></a>
</button>

试试这个，而不是删除<a>标签并将onclick()事件应用于按钮：

<button onclick="window.open('http://www.google.ro', 'sharer', 'toolbar=0,status=0,width=500,height=325');"><img src=""/></button>

小提琴

于 2013-03-22T11:25:10.700 回答
0

一个标签把它搞砸了，而 chrome 足以修复它:)

试试这个：

<div><button onClick="window.open('http://www.google.ro', 'sharer', 'toolbar=0,status=0,width=500,height=325');" href="javascript: void(0)"><img src="http://cdn1.iconfinder.com/data/icons/Futurosoft%20Icons%200.5.2/128x128/apps/vlc.png"/></button></div>

http://jsfiddle.net/trefu/TVJWD/154/

于 2013-03-22T11:25:53.757 回答
0

您可以处理在 JavaScript 中打开的新窗口：-

$("a").click(function(e) {
    e.preventDefault();
    window.open($(this).attr('href'), 'sharer', 'toolbar=0,status=0,width=500,height=325');
    $(this).parent().hide();
});

...并从标记中删除 JavaScript：-

<div><a href="http://www.google.ro"><img src="http://cdn1.iconfinder.com/data/icons/Futurosoft%20Icons%200.5.2/128x128/apps/vlc.png"/></a></div>

将 JavaScript 与 HTML 分开是最佳实践，因为这将使您更容易进行维护和错误修复。

此外，您不应该在表单元素中使用链接。没有它应该可以正常工作：- http://jsfiddle.net/drmonkeyninja/TVJWD/165/

于 2013-03-22T11:26:10.180 回答
0

用按钮而不是链接绑定onClick事件，如下所示..

<div><button onClick="window.open('http://www.google.ro', 'sharer', 'toolbar=0,status=0,width=500,height=325');" href="javascript: void(0)"><img src="http://cdn1.iconfinder.com/data/icons/Futurosoft%20Icons%200.5.2/128x128/apps/vlc.png"/></button></div>

这将起作用。

于 2013-03-22T11:33:19.063 回答