如何修复 html 按钮单击复制内容浏览器在 jQuery 中不一致？

Question

我有以下示例代码，当我点击顶部按钮时，它的内容将被复制到底部按钮，这在 Firefox 和 IE 中工作正常，但在 Chrome 中，它只复制你点击的字符，不是整个按钮的内容，但是如果你点击上方按钮的边缘或4个角，整个内容将被复制到底部按钮，如何解决[=15=中的行为] 所以它会与其他浏览器保持一致？

<HTML>
  <HEAD><META http-equiv="Content-Type" content="text/html; charset=utf-8"></HEAD>

  <SCRIPT src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></SCRIPT>

  <SCRIPT>
  $(document).ready(function()
  {
    $('button').click(function(event)
    {
      var Clicked_Button=event.target;
      $('#Target_Button').html($(Clicked_Button).html());
    });
  });
  </SCRIPT>

  <BODY>
  <CENTER>

    <BUTTON id=Source_Button style="width: 78px; height: 78px;" type=button>
      <TABLE width=60 border=0 cellspacing=0 cellpadding=5>
        <TR>
          <TD align=Center><FONT color=blue size=4>A</FONT></TD>
          <TD align=Center><FONT color=blue size=4>B</FONT></TD>
        </TR>
        <TR>
          <TD align=Center><FONT color=blue size=4>C</FONT></TD>
          <TD align=Center><FONT color=blue size=4>D</FONT></TD>
        </TR>
       </TABLE>
    </BUTTON>
  <P>
  <BUTTON id=Target_Button style="width: 78px; height: 78px;" type=button></BUTTON>

  </CENTER>
  </BODY>
</HTML>

Answer 1

感谢@aersh 的建议，正确答案是：var Clicked_Button=event.currentTarget;

Answer 2

在事件处理程序中 this 是发生事件的元素，因此您可以使用 $(this).html()

$('button').not('#Target_Button').click(function(event){      
   $('#Target_Button').html($(this).html());
});

如何修复 html 按钮单击复制内容浏览器在 jQuery 中不一致？

How to fix html button click copy content browser inconsistency in jQuery?

html

jquery

copy

button