试图从函数返回一个对象

时间:2017-08-31 01:27:29

标签: javascript jquery object

道歉,但无法找到这个问题的答案。我在html上找到项目并将其推送到一个对象,但我无法弄清楚我的生活,为什么这个函数不返回对象?我可以毫无问题地安慰。

function getItem(obj){
  var itemsObj;
  $('.info').on('click', function(){
    itemsObj = {};
    $this = $(this);
    itemsObj.gameImg = $this.parent().parent().find('img').attr('src');
    itemsObj.gameTitle  = $this.parent().parent().find('p').text();
    itemsObj.gameInfo = $this.parent().parent().find('h2').text();
    // console.log(itemsObj);
    return itemsObj;
  });
}
//getItem();
console.log(getItem());
<div class="col-lg-3 game">
              <div class="view view-first">
               <img src="img/deathstranding.jpg"/>
               <div class="mask">
               <h2>Death Stranding</h2>
               <p>Death Stranding is an upcoming action video game developed by Kojima Productions and published by Sony Interactive Entertainment for PlayStation 4. It is the first game by game director Hideo Kojima and his company following the 2015 disbandment of Kojima Productions as a subsidiary of Konami and subsequent reformation as an independent studio.</p>
                   i<a href="#" class="info">♥</a>
               </div>
             </div>

2 个答案:

答案 0 :(得分:1)

因为你从一个事件处理程序返回,这是另一个函数本身。 如果您只想将其推送到本地存储,为什么不在事件处理程序中执行此操作?

&#13;
&#13;
$('.info').on('click', function(){
  itemsObj = {};
  $this = $(this);
  itemsObj.gameImg =  $this.parent().parent().find('img').attr('src');
  itemsObj.gameTitle = $this.parent().parent().find('h2').text();
  itemsObj.gameInfo = $this.parent().parent().find('p').text();
  // getting previous info
  var savedInfo = localStorage.getItem("gamesinfo");
  // since everything is saved as string , we need to use json
  savedInfo = JSON.parse(savedInfo);
  // check if its not null
  savedInfo = savedInfo ? savedInfo : {};
  // use a unique identifier to save objects , do not push the object into an array every time
  savedInfo[itemsObj.gameTitle] = itemsObj;
  // stringify data and save it
  localStorage.setItem("gamesinfo", JSON.stringify(savedInfo));
  
  
  
  // to retrieve all of games info:
  console.log(JSON.parse(localStorage.getItem("gamesinfo")));
});
&#13;
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="col-lg-3 game">
  <div class="view view-first">
   <img src="img/deathstranding.jpg"/>
   <div class="mask">
   <h2>Death Stranding</h2>
   <p>Death Stranding is an upcoming .....</p>
       i<a href="#" class="info">♥</a>
  </div>
</div>
&#13;
&#13;
&#13;

答案 1 :(得分:1)

它没有返回任何内容的原因是因为你返回click事件监听器函数的数据而不是getItem()函数,也没有办法以那种方式返回

function getItem(obj){
  var itemsObj;
  $('.info').on('click', function(){
    itemsObj = {};
    $this = $(this);
    itemsObj.gameImg = $this.parent().parent().find('img').attr('src');
    itemsObj.gameTitle  = $this.parent().parent().find('p').text();
    itemsObj.gameInfo = $this.parent().parent().find('h2').text();
    // This sends data to click event listener not getItem()
    return itemsObj;
  });
}

为了接收您想要的项目,您应该实现回调

function getItem(callback){
  var itemsObj;
  $('.info').on('click', function(){
    itemsObj = {};
    $this = $(this);
    itemsObj.gameImg = $this.parent().parent().find('img').attr('src');
    itemsObj.gameTitle  = $this.parent().parent().find('p').text();
    itemsObj.gameInfo = $this.parent().parent().find('h2').text();
    // call the callback function parameter and send itemsObj as argument, callback function then received the argument as you wanted it to be. Then execute stuff from there.
    callback(itemsObj);
  });
}

// send a function instead for getItem to call when all is well
getItem(function (data) {
   // here you will receive the data
   console.log(data);
   // stuff
});

提示:如果您想要一个更酷的解决方案,您想要实施successfail方案,请检查jQuery Deffered JavaScript Promises

希望有所帮助