javascript - 压缩javascript中多个事件的代码

Question

这可以以更好的方式完成，还是我必须为所有人输入“object.event = function”？

namn1.onfocus = clearField;
foretag1.onfocus = clearField;
telefon1.onfocus = clearField;
hemsida1.onfocus = clearField;
meddelande1.onfocus = clearField;
namn2.onfocus = clearField;
foretag2.onfocus = clearField;
telefon2.onfocus = clearField;
hemsida2.onfocus = clearField;
meddelande2.onfocus = clearField;

namn1.onblur = restoreField;
foretag1.onblur = restoreField;
telefon1.onblur = restoreField;
hemsida1.onblur = restoreField;
meddelande1.onblur = restoreField;    
namn2.onblur = restoreField;
foretag2.onblur = restoreField;
telefon2.onblur = restoreField;
hemsida2.onblur = restoreField;
meddelande2.onblur = restoreField;

Answer 1

你可以做这样的事情，但它并没有那么好：

var fields = [
    namn1, foretag1, telefon1, hemsida1, meddelande1,
    namn2, foretag2, telefon2, hemsida2, meddelande2
];

for (var i = 0; i < fields.length; i++) {
    fields[i].onfocus = clearField;
    fields[i].onblur = restoreField;
}

jQuery 会给你更多的控制权，但我不知道你是否想使用它。

Answer 2

var elements = [namn1, foretag1, telefon1, hemsida1, meddelande1, namn2, foretag2, telefon2, hemsida2, meddelande2];
for (var i in elements) {
    elements[i].onfocus = clearField;
    elements[i].onblur = restoreField;
}

如果这些元素可以通过 ID 访问，这可以变得更加简洁——然后，可以通过获取每对元素来将数组减半。

Answer 3

[namn1, foretag1, telefon1, hemsida1, meddelande1,
 namn2, foretag2, telefon2, hemsida2, meddelande2].forEach(function(e) {
  e.onfocus = clearField;
  e.onblur = restoreField;
});

Answer 4

只是肖恩回答的一个微小变化，因为我喜欢这种创建数组的方法。

var fields = "namn1 foretag1 telefon1 hemsida1 meddeland1 namn2 foretag2 telefon2 hemsida2 meddelande2".split(" ");

for(i=0; i<fields.length; i++){
   fields[i].onfocus = clearField;
   fields[i].onblur = restoreField;
}