jquery對象不能作爲全局變量工作

Question

這是代碼的一個非常簡化的版本來解釋我的問題。

HTML：

<input type="radio" name="enableDisableBox" id="radioDisable" checked="checked" /> 
Disable 
<br /> 
<input type="radio" name="enableDisableBox" id="radioEnable" /> 
Enable 
<br /> 
<input type="text" id="txtUserInput" disabled="disabled" /> 

的JavaScript：

var txtInputObj2 = $("#txtUserInput"); 

function init1() { 
    var txtInputObj1 = $("#txtUserInput"); 
    $("input[name='enableDisableBox']:radio").change(function() { 
     if ($("#radioEnable").attr("checked")) 
      txtInputObj1.removeAttr("disabled").focus(); 
     else 
      txtInputObj1.attr("disabled", "disabled"); 
    }); 
} 

function init2() { 
    $("input[name='enableDisableBox']:radio").change(function() { 
     if ($("#radioEnable").attr("checked")) 
      txtInputObj2.removeAttr("disabled").focus(); 
     else 
      txtInputObj2.attr("disabled", "disabled"); 
    }); 
} 

$(document).ready(function() { 
    init1(); 
    //init2(); 
}); 

如果我運行INIT2功能，它並沒有給我任何的錯誤，但不啓用或禁用任何文本框我。

如果您注意到，txtInputObj1在init1函數中定義，並且txtInputObj2被定義爲全局變量。

關於如何使jQuery選擇器對象全局的任何建議？

Answer 1

var txtInputObj2 = $("#txtUserInput");在DOM就緒處理程序之外運行，因此該元素當時不可用，否則它會起作用。

編輯：

在我看來，這是一個壞主意，但是這是你會怎麼做你問什麼。 首先聲明變量，或者聲明其作爲全球性的，並設定值時，DOM是準備

var txtInputObj2; 

function init2() { 
    $("input[name='enableDisableBox']:radio").change(function() { 
     if ($("#radioEnable").attr("checked")) 
      txtInputObj2.removeAttr("disabled").focus(); 
     else 
      txtInputObj2.attr("disabled", "disabled"); 
    }); 
} 

$(document).ready(function() { 
    txtInputObj2 = $("#txtUserInput"); 

    // could also do window.txtInputObj2 without the previous decleration 

    init1(); 
    init2(); 
}); 

Answer 2

DEMO
爲什麼不一樣的東西：

// function outside DOM ready 
function init() { 
    $(":radio[name='enableDisableBox']").change(function() { 
     $('#txtUserInput').prop('disabled', this.id=="radioDisable").focus(); 
    }); 
} 

$(function() { // DOM IS NOW READY 

    init(); // Function called inside DOM ready so all fine! 
    // OTHER CODE HERE 

}); 

---

如果您想創建一個可重複使用的var來存儲你可以做的元素：

// function outside DOM ready 
function init(elemSelector) { // NOTE the elemSelector argument! 
    $(":radio[name='enableDisableBox']").change(function() { 
     elemSelector.prop('disabled', this.id=="radioDisable").focus(); 
    }); 
} 

$(function() { // DOM IS NOW READY 
    var myInput = $('#txtUserInput'); // Reusable element variable 
    init(myInput); // send your var as an argument to your fn. 
    // OTHER CODE HERE 
    // Reuse myInput variable as your element selector if needed like: 
    // myInput.blur(); 
}); 

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.