获取点击元素的文本信息 复制到剪切板 监听鼠标悬浮

 

监听鼠标悬浮

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8" />
  <title></title>
</head>

<!-- <link href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/4.6.1/css/bootstrap.min.css" rel="stylesheet"> -->
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

<body style="border: 1px solid red;margin: 4px;">
  <table class="table table-bordered">
    <caption></caption>
    <thead>
      <tr>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td>ā</td>
        <td>á</td>
        <td>ǎ</td>
        <td>à</td>
      </tr>
      <tr>
        <td>ō</td>
        <td>ó</td>
        <td>ǒ</td>
        <td>ò</td>
      </tr>
      <tr>
        <td>ē</td>
        <td>é</td>
        <td>ě</td>
        <td>è</td>
      </tr>
      <tr>
        <td>ī</td>
        <td>í</td>
        <td>ǐ</td>
        <td>ì</td>
      </tr>
      <tr>
        <td>ū</td>
        <td>ú</td>
        <td>ǔ</td>
        <td>ù</td>
      </tr>
      <tr>
        <td>ǖ</td>
        <td>ǘ</td>
        <td>ǚ</td>
        <td>ǜ</td>
      </tr>
      <tr>
        <td>ṉ</td>
        <td>ń</td>
        <td>ň</td>
        <td>ǹ</td>
      </tr>
      <tr>
        <td>ḡ</td>
        <td>ǵ</td>
        <td>ǧ</td>
        <td>ġ</td>
      </tr>
      <tr>
        <td>ṙ</td>
        <td>ŕ</td>
        <td>ř</td>
        <td>ṟ</td>
      </tr>
    </tbody>
  </table>
</body>
<script>
  $("td").hover(function () {
    $("td").css("background-color", "white");
    $(this).click(function () {
      var ret = $(this).text();
      navigator.clipboard.writeText(ret);
      $(this).css("background-color", "green");
    });

  });
</script>

</html>

　　

 

posted @ 2022-01-17 02:03  papering  阅读(69)  评论(0)    收藏  举报