三元运算符不会更改backgroundColor

Question

我试图在输入为空时设置背景，并在有一些输入时保持此值

function emptyto(element){
    return element.value == '' ? element.style.backgroundColor = "#ccc" : element.val()
}

Answer 1

您只是将作业放在错误的位置：

function emptyto(element){
    return element.style.backgroundColor = element.value == '' ? "#ccc" : element.val();
    // ----^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
}

另外：DOM元素没有val方法。您要么想value在两个地方都使用：

function emptyto(element){
    return element.style.backgroundColor = element.value == '' ? "#ccc" : element.value;
    // ----^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
}

或者，如果您使用的是jQuery，则包装元素并val在两个地方都使用（以及css）：

function emptyto(element){
    var $el = $(element);
    return $el.css("backgroundColor", $el.val() == '' ? "#ccc" : $el.val());
}

实际上，由于它''是一个伪造的值，因此我们可以使用功能强大的||运算符 ¹来简化该运算：

function emptyto(element){
    return element.style.backgroundColor = element.value || "#ccc";
}

¹（这是我贫乏的小博客上的帖子。）