Question

我尝试创建变量oldValue然后如果当前值为=== ""，那么它将更改回oldValue，因为我使用的是for循环我可以明确说出价值是什么。

代码正在更改div元素周围的input，这就是.parentNode的原因

任何人都可以告诉我如何获取输入的值并将其保存，或者我的代码出错了。

var inputFocus = function(){
var inputs = document.getElementsByClassName("inputNoFocus");
for (i = 0; i < inputs.length; i++){
    var input = inputs[i];
    var oldValue = this.value;

    input.addEventListener("focus", function(){

        if(this.value === this.value){
            this.value = "";
        }
        this.parentNode.parentNode.setAttribute("class", "inputFocus");
    }, false);

    input.addEventListener("blur", function(){
        if(this.value === ""){
            this.value = oldValue;
        }
        this.parentNode.parentNode.setAttribute("class", "noHover");
    }, false);
}
}();

Answer 1

我不确定你要做什么，但是根据我的理解 - 事件监听器中函数中this.value的值将返回null - 理由是JavaScript中的作用域。值this.value的范围将在父函数中，而不是在事件列表匿名函数中定义的函数。

尝试阅读http://www.adequatelygood.com/2010/2/JavaScript-Scoping-and-Hoisting您将了解范围以及您可能出错的原因或位置。

Answer 2

试试这个：

(function() {
  var inputs = document.getElementsByClassName("inputNoFocus");

  function setEmptyVal() {
    if (this.value == this.defaultValue) this.value = "";
    this.parentNode.parentNode.setAttribute("class", "inputFocus");
  }

  function setDefaultVal() {
    if (this.value == "") this.value = this.defaultValue;
    this.parentNode.parentNode.setAttribute("class", "noHover");
  }

  for (i=0; i<inputs.length; i++) {
    var input = inputs[i];

    input.defaultValue = input.value;
    input.addEventListener("focus", setEmptyVal, false);
    input.addEventListener("blur", setDefaultVal, false);
  }
})();

这是the fiddle。

保存输入值，以便在用户留空时将其恢复为默认值

2 个答案: