快速提问;
我有一个带有输入(文本区域、选择和编辑)的表单,我想将我写入的内容镜像到其中。我想将此处输入的数据绑定(bind)到其他字段,仅用于视觉确认。
我使用它来创建一个小型内部 ToDo HTML 网页,当您添加新任务时,我希望输入反射(reflect)在输入字段上方的“预览”任务上。
有办法做到这一点吗? HTML、Javascript 还是 PHP?
提前致谢=)
最佳答案
一个选项,使用 jQuery:
$(':input').change(function(){
$('label[for="' + this.id + '"]').text('Label for "' + this.id + '" value: ' + this.value);
});
在纯 JavaScript 中(迟来的):
function updateLabel (){
var label = this.labels[0],
textProp = 'textContent' in document ? 'textContent' : 'innerText';
label[textProp] = 'Element value: ' + this.value;
}
var inputTypeElems = document.querySelectorAll('input, select, textarea');
[].forEach.call(inputTypeElems, function(a){
a.addEventListener('change', updateLabel);
});
并提供更具响应性的方法:
function updateLabel (){
var label = this.labels[0],
textProp = 'textContent' in document ? 'textContent' : 'innerText';
label[textProp] = 'Element value: ' + this.value;
}
var inputTypeElems = document.querySelectorAll('input, select, textarea');
[].forEach.call(inputTypeElems, function(a){
var evtName;
switch (a.tagName.toLowerCase()){
case 'input':
case 'textarea':
evtName = 'keyup';
break;
default:
evtName = 'change';
}
a.addEventListener(evtName, updateLabel);
});
引用文献:
- 纯 JavaScript:
- jQuery:
关于javascript - HTML - 将文本输入绑定(bind)到标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23076764/