使用 Javascript 的自定义共享未按预期工作

Question

我正在开发一个简单的自定义共享，用户将在其中单击显示共享选项列表的共享按钮，然后用户可以单击其中任何一个来共享页面。

我在 CodePen 上设置了代码，不知道为什么它不起作用。

<html>

<head>
  <script src="https://code.jquery.com/jquery-2.1.4.js"></script>

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

<body>
  <a class="share-btn" href="#">S</a>
  <div class="share"><a href="http://www.facebook.com/sharer/sharer.php?u=http://domain.com"> F</a>
  </div>

  <div class="share"><a  href="whatsapp://send?text=The text to share!" data-action="share/whatsapp/share">W</a></div>

  <div class="share"><a  href="http://twitter.com/intent/tweet?status=This is the Title+http://domain.com/article/this-is-article
">T</a></div>


</body>

</html>


   jQuery(document).ready(function($) {
     $('.share').click(function() {
       var NWin = window.open($(this).prop('href'), '', 'menubar=no,toolbar=no,resizable=yes,scrollbars=yes,height=300,width=600');
       if (window.focus) {
         NWin.focus();
       }
       return false;
     });
   });

   $(".share-btn").click(function() {
     $(".share").toggle();
   });

Answer 1

将 $('.share').click 更改为 $('.share > a').click 否则 $(this) 指的是没有属性的 div href.

这是一个例子： http://codepen.io/anon/pen/rWObQo

$('.share > a').click(function() {

使用 Javascript 的自定义共享未按预期工作

Custom Share using Javascript not working as desired

javascript

jquery

share