Question

我有一个预定义大小的div。我添加了2个输入字段，用户可以在其中键入宽度和高度，在模糊时，它会通过函数动态地改变框的大小。只有当2个变量“custWidth”＆amp; “custHeight”在函数内声明，而不是在函数外声明。基本上这些变量存储在输入框中键入的值。

现在我想，变量声明外部函数在全局范围内，函数也可以使用它们还是有其他问题？

以下是小提琴的链接： http://jsfiddle.net/vineetgnair/0tdaxtjt/29/

var box = $('#box');
var custWidthField = $('#width');
//var custWidth = custWidthField.val();
var custHeightField = $('#height');
//var custHeight = custHeightField.val();
custWidthField.blur(function () {
    var custWidth = custWidthField.val(); // Not Working When Declared outside function
    // alert(custWidth)
    box.css('width', custWidth);
});
custHeightField.blur(function () {
    var custHeight = custHeightField.val(); // Not working when delared outside function
    //alert(custWidth)
    box.css('height', custHeight);
});

谢谢

Answer 1

问题不在于变量的声明或范围，而在于fieldname.val()调用的时间。

如果你在函数外面调用custWidthField.val()，那么在用户有机会输入任何内容之前，你只需要在加载文档时获取字段的值。当用户填写表单字段时，它们不会更改。您需要在blur处理程序中分配它们，以便获取表单字段的当前值。

Answer 2

在函数内部设置变量时，不需要再次使用var。这是重新设定范围。试试这个：

var box = $('#box'),
    custWidthField = $('#width'),
    custHeightField = $('#height'),
    custWidth,
    custHeight;

custWidthField.blur(function () {
    custWidth = custWidthField.val();
    box.css('width', custWidth);
})

custHeightField.blur(function () {
    custHeight = custHeightField.val();
    box.css('height', custHeight);
})

Example fiddle

Answer 3

如果在函数之外定义变量，它们实际上是全局变量！

问题是他们修复了#height和#width的第一个值的固定参数。

每次执行函数时都需要为它们分配新值！

变量在全局范围内声明不起作用

3 个答案: