javascript - 将 jquery 代码应用于多个文本区域

Question

我有一些代码可以工作，但有很多重复: http://jsfiddle.net/6Wp2j/25/

$('input.apple').on('keyup', function() {
    $("div.apple").html(this.value);
});

$('input.orange').on('keyup', function() {
    $("div.orange").html(this.value);
});

$('input.banana').on('keyup', function() {
    $("div.banana").html(this.value);
});

我想知道是否有一种方法可以将项目放入某种数组中，以便我可以将相同的代码应用于多个不同的字段。

Answer 1

您可以定位所有输入，或者只是给它们一个通用的目标类，并提取一些内容，我使用了该类，但如果元素具有多个类等，数据属性会更容易:

$('input').on('keyup', function() {
    $('.'+this.className).html(this.value);
});

FIDDLE

编辑:

如上所述，如果元素有多个类，请使用数据属性:

<input class="input" data-id="apple" >
<input class="input" data-id="orange" >
<input class="input" data-id="banana" >  

JS

$('.input').on('keyup', function() {
    $('.' + $(this).data('id')).html(this.value);
});

FIDDLE