在$（document）.ready（）函數中設置的jQuery值

Question

我想在DOM完全加載後設置對象的值。問題是，在調用文本框中的OnBlur和OnFocus事件後，我得到空指針異常。我究竟做錯了什麼？

的javascript：

$(document).ready(function() { 
    var sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last() 
}); 

var tempThursdayHrs = 0.0; 
function BlurThursdayHrs(sender, args) { sumThursdayHrs.text(tempThursdayHrs + sender.get_value()); } 
function FocusThursdayHrs(sender, args) { tempThursdayHrs = sumThursdayHrs.text() - sender.get_value(); } 

標記：

<telerik:RadNumericTextBox ID="txtThursdayHrs" runat="server" NumberFormat-DecimalDigits="1" 
     Width="25px" MinValue="0" Type="Number" DbValue='<%# Eval("ThursdayHrs") %>'> 
     <ClientEvents OnBlur="BlurThursdayHrs" OnFocus="FocusThursdayHrs" /> 
</telerik:RadNumericTextBox> 

錯誤：

Microsoft JScript runtime error: 'sumThursdayHrs' is undefined

Answer 1

正如您在標題中所說的，在函數（就緒事件處理程序函數）中將值設置爲。但是JavaScript具有函數範圍，並且由於您使用var關鍵字將sumThursdayHrs聲明爲本地（而不是「私有」）變量，所以它從外部未定義。兩個可能性：

• 使sumThursdayHrs一個全局變量（刪除「VAR」）（並最終宣佈它在外面）。請注意，應儘可能避免使用全局變量，以排除命名衝突，並避免將使用它的所有函數放在同一範圍內。注意，那麼這些函數也將不再具有全局可用性，因此您需要在相同的上下文中設置模糊/焦點處理程序（如Patrick Scott所建議的）。

Answer 2

，如果你使用jQuery已經爲什麼不綁定jQuery的事件？

$('span[id$="txtThursdayHrs"]:first').on("focus", FocusThursdayHrs) 
      .on("blur", BlurThursdayHrs); 

此外，聲明文檔準備函數內部的功能，使他們可以訪問sumThursdayHrs，或在同一個地方使用匿名函數，而不是調用函數的

例：

$(document).ready(function() { 
    var sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last(); 
    var tempThursdayHrs = 0.0; 
    $('span[id$="txtThursdayHrs"]:first').on("focus", function() { 
     sumThursdayHrs.text(tempThursdayHrs + $(this).val()); 
    }) 
    .on("blur", function() { 
     tempThursdayHrs = sumThursdayHrs.text() - $(this).val(); 
    }); 
}); 

或者將sumThursdayHrs移動到全局對象...爲了理智，我建議不要將它放在窗口中。

而是定義一個全局名稱空間來保存應用程序特定的全局變量。這被稱爲全球減排。

Ex。

var MyApp = {}; 
$(document).ready(function() { 
    MyApp.sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last(); 
    //... 

-

MyApp.tempThursdayHrs = 0.0; 
function BlurThursdayHrs(sender, args) { MyApp.sumThursdayHrs.text(MyApp.tempThursdayHrs + sender.get_value()); } 
function FocusThursdayHrs(sender, args) { MyApp.tempThursdayHrs = MyApp.sumThursdayHrs.text() - sender.get_value(); } 

Answer 3

的錯誤是由於作用域：

$(document).ready(function() { 
    // sumThursdayHrs is a *local* variable to the function 
    var sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last() 
}); 

// ... so this will fail because it is trying to use 
// window.sumThursdayHrs (the property sumThursdayHrs on the window object), 
// which is not set and thus the Reference Error 
function BlurThursdayHrs(sender, args) { 
    sumThursdayHrs.text(tempThursdayHrs + sender.get_value()); 
} 

「簡單修復」（其可以是或可以不是有效的）是：

$(document).ready(function() { 
    // Set the "global variable" sumThursdayHrs 
    // "window." isn't technically required, but it is to show a point. 
    window.sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last() 
}); 

快樂編碼。

Answer 4

我不確定您給出的代碼示例是否在同一個包中，但是如果您已在$(document).ready()內定義了一個變量，則知道該變量位於閉包內部。在它之外，它將是未定義的。

那麼，爲什麼不能做到這一點：

$(document).ready(function() { 
    var sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last(); 

    var tempThursdayHrs = 0.0; 

    function BlurThursdayHrs(sender, args) { 
     sumThursdayHrs.text(tempThursdayHrs + sender.get_value()); 
    } 

    function FocusThursdayHrs(sender, args) { 
     tempThursdayHrs = sumThursdayHrs.text() - sender.get_value(); 
    } 
}); 

在上面的代碼，它應該拿起你想要的值，因爲一切都是$(document).ready()閉包內。另外，你已經將一個jQuery對象$('span[id*="lblThursdayHrs"]')分配給一個變量，所以它必須在jQuery環境內部使用，而不是在外面......總之，如果你使用的是jQuery，那麼把它保存在jQuery環境中。

你所做的是，你已經與jquery簽訂了一份合約，你將通過做var sumThursdayHrs = $('span[id*="lblThursdayHrs"]').last()來使用它的所有方法和屬性。一旦你使用$(something)，就是這樣，它必須在jQuery環境中使用。