Question

我遇到了一个问题，虽然我还在学习javascript，但我觉得这个问题很奇怪。我只想在设置状态值时进行一些计算，如果状态未设置则我希望表单字段为焦点。

现在的问题是以下代码无效

document.getElementById('cart-hplus').addEventListener('submit', estimateTotal);

function estimateTotal(event) {
    event.preventDefault();

    var state = document.getElementById('s-state').value;
    if (state === '') {
        alert("Please choose your preferred shipping state.");

        state.focus();
    }
}

未捕获的TypeError：state.focus不是函数

但是这样可行，但我不认为声明变量然后在if语句中再次使用文档对象的好习惯

function estimateTotal(event) {
    event.preventDefault();

    var state = document.getElementById('s-state').value;
    if (state === '') {
        alert("Please choose your preferred shipping state.");

        document.getElementById('s-state').focus();
    }
}

第一个代码出了什么问题？

Answer 1

您没有区分状态输入控件和状态值。您将需要使用2个变量：

function estimateTotal(event) {
    event.preventDefault();
    var state = document.getElementById('s-state');
    var stateValue = state.value;
    if (stateValue === '') {
        alert("Please choose your preferred shipping state.");
        state.focus();
    }
}

另外，你的方式很好。引用该对象两次没有任何问题。

Answer 2

在您的第一个代码中进行以下更改

document.getElementById('cart-hplus').addEventListener('submit', estimateTotal);

function estimateTotal(event) {
    event.preventDefault();

    var state = document.getElementById('s-state');
    if (state.value === '') {
        alert("Please choose your preferred shipping state.");

        state.focus();
    }
}

HTMLElement focus（）方法未捕获TypeError

2 个答案: