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.