【问题标题】:Why cannot assign value inside a function to variable declared outside (globaly)?为什么不能将函数内部的值赋给外部(全局)声明的变量?
【发布时间】:2012-02-22 15:19:01
【问题描述】:

我不知道为什么我不能将 .hover 函数捕获的值分配给全局声明的变量。

这是我的 jQuery 代码:

jQuery(function($){

  var receipt;

  $("#cartItems tr.cItem").hover(

        function()
        {
            $(this).addClass("highlight");
            receipt = $(this).next().children().text();
            console.log(receipt);
        },
        function()
        {
            $(this).removeClass("highlight");
        }
    );

    console.log(receipt);

  });

这是我的 HTML:

<table id="cartItems">
  <tr>
     <td>Lp.</td><td>z:</td><td>na:</td><td>cena netto:</td>
  </tr>
  <tr class="cItem">
      <td>ru</td><td>pl</td><td>16.00</td>
  </tr>
  <tr>
      <td colspan="4">some simple text that should be assigned </td>
  </tr>
 </table>

第一个console.log(receipt)(在.hover 函数内)工作正常,输出some simple text..,第二个什么也不输出。

请帮忙。

谢谢大家这么快的回复。你们都对 .hover 功能是绝对正确的。我的错。但现在我有另一个相关的问题。 我需要这个值将它传递给像这样调用的“qTip”插件:

$("#cartItems tr.cItem").qtip(
{
    content: receipt,
    show: 'mouseover',
    hide: 'mouseout'
 });

我应该以某种方式合并这个调用吗?

【问题讨论】:

  • 第二个console.log只会运行一次,当封闭函数被执行时,没有任何东西被分配给receipt。

标签: javascript jquery html variables scope


【解决方案1】:

对 console.log 的“第二次”调用实际上是第一次调用(它发生在文档准备就绪时),此时您的 var 尚未定义

【讨论】:

    【解决方案2】:

    只有在调用悬停函数后,才会将值分配给receipt。您在#cartItems tr.cItem 悬停之前登录到控制台。

    【讨论】:

      【解决方案3】:

      正如其他人所提到的,您当前放置 console.log(receipt) 的位置,receipt 尚未初始化。

      如果您想将其更改为更有意义的内容,您可以:

      1. 将变量声明移到加载函数之外
      2. 在其自己的函数中调用 console.log(receipt),您可以将其附加到单击事件或任何其他操作加载函数之后。
      var receipt;
      
      jQuery(function ($) {
          $("#cartItems tr.cItem").hover(
      
          function () {
              $(this).addClass("highlight");
              receipt = $(this).next().children().text();
              console.log(receipt);
          }, function () {
              $(this).removeClass("highlight");
          });
      
      });
      
      function printConsole() {
          console.log(receipt);
      }
      

      这是一个 jsfiddle 演示,展示了这一点。

      注意它第一次输出的值是undefined,因为当页面第一次加载时,悬停事件尚未触发,因此变量未初始化。悬停并单击链接后,它现在具有一个值。

      【讨论】:

      • 这应该没什么区别。第二个日志仍然记录undefined,因为尚未为receipt 分配值。
      • 在 jQuery(function($) { 之前移动变量声明不起作用。在 .hover 执行结束后是否有任何解决方案来存储此值?
      • 我添加了一个简短的 jsfiddle 演示。你必须更清楚什么是行不通的。
      • .qtip( 功能不起作用(我的问题结束)。这是一个弹出小信息窗口的插件,它工作正常,但我无法将取自 .hover 元素的文本传递给它
      【解决方案4】:

      就代码中的布局而言,第二个console.log 发生在悬停之前,因此变量未定义。悬停后,它会正确记录下一个 tr 子项的文本。这是一个 jsfiddle,您的代码工作正常。 http://jsfiddle.net/63xKR/

      【讨论】:

        【解决方案5】:

        hover() 函数只有在您实际将鼠标悬停在元素上时才会执行。所以你写的基本上是:

        var receipt = null;
        var documentReady = someFunctionToBeExecutedLater(){ doesnt matter whats in here };
        console.log(receipt);
        

        如您所见,实际上没有人调用函数 (documentReady()),因此收据将保持为空。

        【讨论】:

          猜你喜欢
          • 2018-11-12
          • 2019-02-08
          • 1970-01-01
          • 1970-01-01
          • 2014-01-17
          • 2012-05-23
          • 1970-01-01
          • 1970-01-01
          • 2015-02-10
          相关资源
          最近更新 更多