Question

$('#lobSelect').change(function () {
    var selectedLob = $('#mainWrapper').find('select[name="lob-select"] option:selected').val();
    console.log(selectedLob); //prints to the console
});

console.log(selectedLob); //not available here

在上面的代码中，我使用变量selectedLob来存储从下拉列表中选择的值。

如何从函数外部检索该值？

另外说这个函数存储在file1.js中 - 我如何从另一个文件夹中的file2.js访问这个变量。

由于

Answer 1

声明变量时，将其置于声明的函数范围内。

在函数外声明它：

var selectedLob;

并且不要在里面重申：

$('#lobSelect').change(function () {
    selectedLob = $('#mainWrapper').find('select[name="lob-select"] option:selected').val();
    console.log(selectedLob); //prints to the console
});

这里仍然未定义：

console.log(selectedLob); //not available here

因为在更改事件触发之前它没有为其分配值，但在事件发生后可以在更广泛的范围内访问它。

Answer 2

您可以将全局变量用于您的任务，但这会导致污染全局命名空间。

好的做法是使用应用程序命名空间而不是全局命名空间

你的file1.js

// your app namespace
var app = app || {};

// on document ready wrapper
$(function () {

$('#lobSelect').change(function () {
    // initialize your variable at app namespace
    app.selectedLob = $('#mainWrapper').find('select[name="lob-select"] option:selected').val();
});

});

你的file2.js

// use the same app namespace or create it
// if not exist yet (in case when file2.js was loaded before file1.js)
var app = app || {}; 
$(function () {

// app.selectedLob is available here

});

Answer 3

var selectedLob是$('#lobSelect').change(function () {函数的本地函数，无法在

之外访问

<强>解决方案

var selectedLob =''; //declare variable outside so it accessible 
$('#lobSelect').change(function () {
    //assign value here
    selectedLob = $('#mainWrapper').find('select[name="lob-select"]  option:selected').val();
    console.log(selectedLob); //prints to the console
});

console.log(selectedLob);
 //it doesn't get the value as it runs before the change event fires so you get undefined value

阅读What is the scope of variables in JavaScript?

Answer 4

您可以使用jQuery .data函数存储在$('#lobSelect')

中

$('#lobSelect').data("yourKey", yourVariable)

并像这样检索：

var someVariable = $('#lobSelect').data("yourKey")

如果您想在之后使用它（数据将存储更长时间），请按照建议在函数外部声明变量：

var selectedLob;
$('#lobSelect').change(function () {
    selectedLob = $('#mainWrapper').find('select[name="lob-select"] option:selected').val();
    console.log(selectedLob); //prints to the console
});

console.log(selectedLob); 
//accessible here, 
//maybe not elsewhere in your code (depending on your code structure)

Answer 5

您还可以使用以下方法在函数内设置全局变量

window["variableName"] = "some value";

然后在任何地方访问它。例如：

console.log(window["variableName"]);

Answer 6

你在这里遇到的第一个问题是你在selectedLob变量的范围之外使用selectedLob变量，所以你必须将其声明向上移动一级，以便它可以在函数之外使用好吧（或者更好的是你应该重构你的代码，所以这种类型变得没必要了。）

您遇到的第二个问题是在变更事件处理程序中声明var selectedLob =''; //declare variable outside change handler so it accessible $('#lobSelect').change(function () { //assign value here selectedLob = $('#mainWrapper').find('select[name="lob-select"] option:selected').val(); console.log(selectedLob); //prints to the console }).change(); // This will call your change event handler and hopefully init selectedLob // Now selectedLob should be have value of selected option (if your DOM was ready...) console.log(selectedLob);变量并期望立即定义它。要解决这个问题（如果你在这里使用JQuery），你可以在声明它之后立即调用你的变更处理函数，以便最初开始你的变量初始化。

总结如下：

{{1}}

最后我不得不说你应该真的试图避免这样的事情，尝试重新构建你的JS代码，你可以在DOM准备好之后在一个地方初始化你需要的所有东西，然后再使用某种init函数启动你的应用程序，传递它所需要的或类似的东西。编写这样的代码很快就会陷入一大堆混乱：）

Answer 7

使用全局变量

 var selectedLob;  // use as a global variable to access outside of the function 
     $('#lobSelect').change(function () {
       selectedLob = $('#mainWrapper').find('select[name="lob-select"] option:selected').val();
       console.log(selectedLob); //prints to the console
     });

if(selectedLob!=undefined){

     console.log(selectedLob); //available here
}

检索JS变量

7 个答案: