Question

我正在按钮点击时使用$fb = new Facebook\Facebook([ 'app_id' => 'xxxxxxxxx', 'app_secret' => 'xxxxxxxxxxxxxxxxxxxxxxxxxxx', 'default_graph_version' => 'v2.8', ]); $helper = $fb->getRedirectLoginHelper(); try { $accessToken = $helper->getAccessToken(); } catch(Facebook\Exceptions\FacebookSDKException $e) { // There was an error communicating with Graph echo $e->getMessage(); exit; } $client = $fb->getOAuth2Client(); try { // Returns a long-lived access token $accessTokenLong = $client->getLongLivedAccessToken($accessToken); } catch(Facebook\Exceptions\FacebookSDKException $e) { // There was an error communicating with Graph echo $e->getMessage(); exit; } if (isset($accessTokenLong)) { // Logged in. $_SESSION['facebook_access_token'] = (string) $accessTokenLong; }功能在每个元素中尝试add 10个数字（数字）。我试过这样的

map

预期输出

<!DOCTYPE html>
<html>

  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <script data-require="jquery@*" data-semver="3.1.1" src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
    <style>


    </style>
  </head>

  <body>

    <button class="add">ADD</button>
    <ul class="item">
      <li class="abc">123</li>
      <li class="pp">12</li>
      <li class="abc">78</li>
      <li class="ac">13</li>
    </ul>
    <script>
    $(function () {

        $('.add').click(function () {
            var $items = $('.item li');
            var $newItem =$items.map(function (i,item) {
                console.log($(item).text())
                return $(item).text() +10;
            });
            console.log($newItem)
        });

    });
    </script>
  </body>

</html>

Answer 1

你需要的只是在调用.get()函数之后链接.map()，这将返回你构造的数组，例如：

var $newItem = $items.map(...).get();

需要.get()的原因是.map()生成类似数组的对象。由于您已经开始使用一组jQuery对象（$newItem），它将返回一个DOM节点列表。为了获得你想要的数组，你必须调用.get()来返回一个真正的数组（而不是一个DOM节点列表）。可以在此处更好地解释为什么需要这样做：How can I find all matches to a regular expression in android

在旁注中，$(item).text()不会自动投放到Number。这意味着如果文本的值为123，则实际上它被视为字符串。 +运算符将连接但不执行添加，即$(item).text() + 10将为您12310而不是133。要将其转换为数字，只需map() get() confusion：+$(item).text() + 10。

以下是您的方案的概念验证示例，其中应用了上述两种修改：

$(function() {

  $('.add').click(function() {
    var $items = $('.item li');
    var $newItem = $items.map(function(i, item) {
      console.log($(item).text())
      return +$(item).text() + 10;
    }).get();
    console.log($newItem)
  });

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="add">ADD</button>
<ul class="item">
  <li class="abc">123</li>
  <li class="pp">12</li>
  <li class="abc">78</li>
  <li class="ac">13</li>
</ul>

Answer 2

我认为您正在寻找$.each()而不是$.map()：

$(function() {
  $('.add').click(function() {
    var $items = $('.item li');

    $items.each(function(i, item) {
      $(item).text(parseInt($(item).text()) + 10);
      
      console.log($(item).text())
    });
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="add">ADD</button>
<ul class="item">
  <li class="abc">123</li>
  <li class="pp">12</li>
  <li class="abc">78</li>
  <li class="ac">13</li>
</ul>

Answer 3

以下是使用map方法的解决方案。

您必须使用Array.from()方法。

Array.from（）方法从中创建一个新的Array实例类似数组或可迭代的对象。

此外，您应该使用parseInt()方法添加两个数字。

$(function () {
         $('.add').click(function () {
            var $items = $('.item li');
            var $newItem =$items.map(function (i,item) {
                $(item).text(parseInt($(item).text()) +10);
                return parseInt($(item).text()) +10;
            });
            console.log(Array.from($newItem));
        });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="add">ADD</button>
<ul class="item">
   <li class="abc">123</li>
   <li class="pp">12</li>
   <li class="abc">78</li>
   <li class="ac">13</li>
</ul>

我建议您使用each方法。map只需为每个项目应用提供的array功能，即可创建新的callback。

$('.add').click(function() {
  $('.item li').each(function() {
    $(this).text(parseInt($(this).text())+10);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="add">ADD</button>
<ul class="item">
  <li class="abc">123</li>
  <li class="pp">12</li>
  <li class="abc">78</li>
  <li class="ac">13</li>
</ul>

Answer 4

您要在文本中添加数字。首先，您需要使用JavaScript parseInt（text）函数将文本转换为数字。

parseInt(text here)

并在$ .map函数上使用get（）函数

$.map(function(){}).get();

它会返回一个数组

<强>的js

 $('.add').click(function () {
     var $items = $('.item li');
     var $newItem =$items.map(function (i,item) {
         console.log($(item).text());
         return parseInt($(item).text()) +10;
     }).get();
});

JsFiddle

如何在jquery中使用map函数？

4 个答案: