HIJS

by 2001 Y

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/highlight.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.8.0/styles/androidstudio.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://cdn.jsdelivr.net/clipboard.js/1.5.3/clipboard.min.js"></script>
<pre class="css">
body {
 font-family: 'Rounded-M+', 'Hiragino Kaku Gothic ProN', Helvetica, Arial, sans-serif;
 color: #333333;
 word-wrap: break-word;
}
</pre>

JavaScript

$(function() {
  $('pre').attr("id", "hljs");
  $('pre').attr("data-clipboard-target", "#hljs");
  $('pre').each(function(i, block) {
    hljs.highlightBlock(block);
  });
  var cp = new Clipboard($('.hljs')[0]);
  // コピーした時にアラートを表示する (成功時)
  cp.on('success', function(e) {
    alert('コードのコピーに成功しました!!');
  });
  // コピーした時にアラートを表示する (失敗時)
  cp.on('error', function(e) {
    alert('コードのコピーに失敗しました...');
  });
});