我有2個空輸入。我希望用戶寫入輸入1東西,後文將在輸入顯示2.如何保存輸入值並將值存入其他輸入?
2
A
回答
1
幾許使用jQuery: http://fiddle.jshell.net/Shaz/bwKZt/10/
1
這是我實現這一目標:
function syncFields(from,to){
if(!$(from) || !$(to) || $(to).value.length>0){return false;}
if($(from).nodeName.toLowerCase()=='input' && $(from).type=='text'){
var etype='keyup';
}else if($(from).nodeName.toLowerCase()=='select'){
var etype='change';
}else{
return false;
}
$(from).addEventListener(etype,sync,false);
$(to).addEventListener(etype,function(){$(from).removeEventListener(etype,sync,false);},false);
function sync(){
if($(to).nodeName.toLowerCase()=='input' && $(to).type=='text'){
$(to).value=$(from).value;
}else if($(to).nodeName.toLowerCase()=='select'){
$(to).selectedIndex=$(from).selectedIndex;
}
return true;
}
}
注意,它依賴於DOM 2和原型語法
0
這將這樣的伎倆。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<script type="text/javascript">
function f(a, b) {
document.getElementById(a).value = document.getElementById(b).value;
}
</script>
</head>
<body>
<input id="Submit1" onkeyup="f('Submit2','Submit1')" type="text" value="" />
<input id="Submit2" type="text" value="" />
</body>
</html>
3
既然你沒有用jQuery標記你的問題,我假設你只想用純Javascript做這個。
我會建議使用ID屬性上的領域,像這樣:
<input id="input1" value="">
<input id="input2" value="">
然後,使用下面的JavaScript找到的元素,然後keyUp事件綁定到第一輸入呼叫要執行一個功能將input1的值複製到input2。
var input1 = document.getElementById('input1');
var input2 = document.getElementById('input2');
var updateInputs = function() {
input2.value = input1.value;
}
if (input1.addEventListener) {
input1.addEventListener('keyup', function() {
updateInputs();
});
} else if (input1.attachEvent) { // support IE
input1.attachEvent('onkeyup', function() {
updateInputs();
});
}
這裏你可以看到這個代碼在行動:http://jsfiddle.net/8KptW/1/
要了解更多有關addEventListener
見:https://developer.mozilla.org/en/DOM/element.addEventListener
要了解更多有關getElementByID
見:https://developer.mozilla.org/en/DOM/document.getElementByID
UPDATE
的當然......如果你是包括jQuery框架,你可以使用此代碼:
$('#input1').bind('keyup', function() {
$('#input2').val(this.value);
});
工作實例這裏:http://jsfiddle.net/8KptW/2/
你可以閱讀更多關於jQuery和它的活動在這裏結合:http://api.jquery.com/bind
相關問題
- 1. 如何保存輸入值?
- 2. 保存輸入值
- 3. 電流輸入值其他輸入值
- 4. 保存並恢復Div輸入值
- 5. 如何保存每個輸入值?
- 6. 如何獲得輸入值並在其他輸入中設置此值
- 7. 如何保存輸入ListBoxField的多個值並循環值?
- 8. 如何在輸入表格並將其發送到數組時保存輸入後的值?
- 9. 角:輸入文本輸入框,將其保存在NG-模型
- 10. 檢查輸入的值是否存在如果是防止保存它其他
- 11. 如何讀取輸入並將其保存到文件中
- 12. VBA - 檢查輸入其他值時是否存在某個值
- 13. 輸入文本不能保存按下輸入的值
- 14. Extjs在輸入框中保存值
- 15. 以HTML標記保存輸入值
- 16. JSF在轉換前保存輸入值
- 17. 在數據輸入後保存edittext值
- 18. 保存來自輸入字段的值
- 19. 禁用字段時保存輸入值
- 20. 確保輸入唯一的輸入並將其存儲在數組中
- 21. 將數值輸入到下拉菜單並保存
- 22. 在會話存儲中保存並顯示輸入值
- 23. 使用本地存儲保存並加載輸入值?
- 24. 保存UITextField輸入
- 25. 如何保存通過API TimeEntryValue其他用戶拉力時間輸入值?
- 26. 如何將輸入字段值保存到Tkinter中的磁盤?
- 27. 如何保存輸入複選框值的存儲數組?
- 28. 如何存儲所有HTML輸入值
- 29. 如何使用輸入類型編號中的值進行計算並將值設置爲其他輸入?
- 30. 評估從保存0值的html字段中輸入必需的輸入值?
不要忘記,它也依賴於jQuery。 – McHerbie 2011-03-23 16:44:10
@McHerbie不,只是一個Prototype語法的短劃線:我通常添加'var $ = function(id){if(typeof id =='object'&& id.nodeType && id.nodeType == 1){return id;} return document.getElementById(id); }'到我的JS的頂端。 – Shad 2011-03-23 17:08:13