Question

我对以下代码有一点问题，它会抛出错误，说无法找到代码startPos和refresh。

var listElem = document.getElementById('list');
listElem.addEventListener('touchstart', function(e) {
    var startPos = $("#content").scrollTop(),
    eraInput = document.getElementById('input'),
    refresh = false;
});
listElem.addEventListener('touchend', function(e) {
    if (refresh) {
        if (!$("#input").is(":focus")) {
            $("#input").val("");
        }
        // Stuff...
    }
});
listElem.addEventListener('touchmove', function(e) {
    var move_to = startPos-(e.touches[0].clientY-e.changedTouches[0].screenY);
    if (move_to > 50) {
        refresh = true;
    } else {
        refresh = false;
    }
});

Answer 1

每个函数定义都在JavaScript中创建自己的作用域。这意味着您无法在函数内声明变量并在另一个函数中使用它。当您需要共享变量时，需要在公共范围内声明它们：

var listElem = document.getElementById('list'),
    startPos,
    refresh,
    eraInput;
listElem.addEventListener('touchstart', function(e) {
    startPos = $("#content").scrollTop(),
    eraInput = document.getElementById('input'),
    refresh = false;
});
listElem.addEventListener('touchend', function(e) {
    if (refresh) {
        if (!$("#input").is(":focus")) {
            $("#input").val("");
        }
        // Stuff...
    }
});
listElem.addEventListener('touchmove', function(e) {
    var move_to = startPos-(e.touches[0].clientY-e.changedTouches[0].screenY);
    if (move_to > 50) {
        refresh = true;
    } else {
        refresh = false;
    }
});

Answer 2

您应该在eventListener：

之外指定它们

var startPos, eraInput, refresh;

var listElem = document.getElementById('list');
listElem.addEventListener('touchstart', function(e) {
    startPos = $("#content").scrollTop();
    eraInput = document.getElementById('input');
    refresh = false;
});
listElem.addEventListener('touchend', function(e) {
    if (refresh) {
        if (!$("#input").is(":focus")) {
            $("#input").val("");
        }
        // Stuff...
    }
});
listElem.addEventListener('touchmove', function(e) {
    var move_to = startPos-(e.touches[0].clientY-e.changedTouches[0].screenY);
    if (move_to > 50) {
        refresh = true;
    } else {
        refresh = false;
    }
});

Answer 3

试试这个：

var listElem = document.getElementById('list');
var startPos;
var refresh;
listElem.addEventListener('touchstart', function(e) {
    startPos = $("#content").scrollTop(),
    eraInput = document.getElementById('input'),
    refresh = false;
});
listElem.addEventListener('touchend', function(e) {
    if (refresh) {
        if (!$("#input").is(":focus")) {
            $("#input").val("");
        }
        // Stuff...
    }
});
listElem.addEventListener('touchmove', function(e) {
    var move_to = startPos-(e.touches[0].clientY-e.changedTouches[0].screenY);
    if (move_to > 50) {
        refresh = true;
    } else {
        refresh = false;
    }
});

Answer 4

您的变量看起来超出了您访问它们的范围。

在listElem之后立即声明变量并将它们设置在'touchstart'事件中。

无法找到Var

4 个答案: