Question

我已经阅读了全局声明变量，然后能够在函数中修改它们，但事情对我来说并不奏效。

这是我的代码：

var selectee = "JK";
// get state selected
$('select.form-control.bfh-states').change(function () {
    selectee = $('select option:selected').val();
    // works correctly, but i need to access it outside the function
    console.log(selectee); 
});

// output JK, should change based on a select box on the form
console.log(selectee);

Answer 1

这是因为仅当从select元素触发change事件时才会执行change()处理程序。您正在顺序执行中使用console.log()语句，该语句将在触发更改处理程序之前执行

//this is correct
var selectee = "JK";

//this registers a change handler for the select element
$('select.form-control.bfh-states').change(function () {
    //but this will not execute now!!! it will get executed only when the select elements change event is fired
    selectee = $(this).val();
    console.log(selectee); // works correctly, but i need to access it outside the function
});

//this will get executed as soon as the change handler is registered not after the handler is executed
console.log(selectee);

如果您希望selectee在select元素中选择值，那么您可以执行类似

的操作

var selectee = $('select.form-control.bfh-states').val() || "JK";

一旦处理程序附加到dom就像

那样，

或手动触发select变更处理程序

var selectee = "JK";

$('select.form-control.bfh-states').change(function () {
    selectee = $(this).val();
    console.log(selectee); // works correctly, but i need to access it outside the function
}).change();

Answer 2

解决此问题的方法是从更改处理程序中执行需要选择者值的代码。您不应该首先将它存储在全局变量中。

// get state selected
$('select.form-control.bfh-states').change(function () {
    var selectee = $('select option:selected').val();
    console.log(selectee); // works correctly, but i need to access it outside the function

    // call your other code from here and pass it the current value of selectee
    myOtherFunction(selectee);

});

为了解释，只有当select的值实际发生变化时，才会执行.change()回调函数。它将在稍后的某个时间召唤。因此，要稍后使用选择者的值，您需要在更改新值的同时执行需要该值的代码。

Answer 3

您的代码并不像您想象的那样有效。只有在您的select控件的更改事件被触发后，selectee才会反映新值。事件处理程序内的代码在调用/触发/触发之前不会执行。但是那些外部的，就像你的console.log(selectee)将在第一次加载代码时执行（在你的情况下，没有调用更改事件）。

Answer 4

这是因为change处理程序是一个回调函数，它会在事件发生后触发，而不是执行代码顺序

Answer 5

另一种方法是将所选值传递给新函数，从而在该函数内访问它（不是全局的）。试试这个：

 selectee = "JK";
 // get state selected
$('select.form-control.bfh-states').change(function () {

selectee = $('select option:selected').val();
// works correctly, but i need to access it outside the function
mynewfunc(selectee);

});
function mynewfunc(){
alert(selectee);
}

注意：触发更改后，无法在新功能selectee之外访问变量mynewfunc。

Demo

修改函数中的javascript变量

5 个答案: