这将是我的方法:
使用数据属性来定义每个输入的字符(也使用适当的标签标签和输入的类型属性)
<div>
<label for="textBox1">T1 :</label>
<input type="text" id="textBox1" data-char="X"></input>
<br/>
<label for="textBox2">T2 :</label>
<input type="text" id="textBox2" data-char="Y"></input>
<br/>
<label for="textBox3">T3 :</label>
<input type="text" id="textBox2" data-char="Z"></input>
<br/>
<label for="textBox4">T4 :</label>
<input type="text" id="textBox3" data-char="N"></input>
<br/>
<label for="message">Result :</label>
<input type="text" id="message"></input>
</div>
然后我会遍历每个 keyup 事件的所有文本框,将它们的值解析为一个数字并将相应的字符附加到结果中
$(document).ready(function () {
$('[id^="textBox"]').keyup(function(){
var result = '';
$('[id^="textBox"]').each(function(){
var count = parseInt($(this).val(),10) || 0;
result += Array(count+1).join($(this).data('char'));
});
$('#message').val(result);
});
});
工作小提琴