刪除附加文本表單框文本時激活html文本表單框

我有下面的代碼，當文本輸入到一個框中時，第二個框會自動變爲非活動狀態。如果活動框中的文本被刪除（例如，由於用戶輸入的數據不正確），第二個文本框不會自動變爲活動狀態，它需要重新啓用頁面刷新。刪除附加文本表單框文本時激活html文本表單框

當「活動」文本bx的內容被刪除時，有沒有辦法讓「非活動」文本框激活？

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8" /> 
 
</head> 
 

 
<body> 
 
First name: <input type="text" name="fname" id="fname"><br> 
 
Last name: <input type="text" name="lname" id="lname"><br> 
 
<script type="text/javascript"> 
 
var first = document.getElementById("fname"); 
 
var last = document.getElementById("lname"); 
 
first.addEventListener("blur", function(){ 
 
\t last.disabled = true; 
 
}); 
 
last.addEventListener("blur", function(){ 
 
\t first.disabled = true; 
 
}); 
 
</script> 
 
</body> 
 
</html>

來源

2016-06-11 user2327626

雖然這是很簡單的實現我很好奇，爲什麼* *你這樣做;一個人可以有姓氏*或*名字，但不是兩個？或者我真的誤解了你的用戶界面？ –

姓名和名字實際上並不是他們的選擇，他們將是「每個」和「總計」，它們指的是成本，因爲該項目允許用戶根據總人數計算出國外活動的費用是否知道每項成本或總成本，以便計算總體個人成本。這個例子更容易使用名稱。 – user2327626

要做到你的要求，你需要支付的四個條件：

（1）當焦點上的字段中的一個，禁用其他字段

（2）當刪除活動字段內的所有數據，使另一場

（3）當添加新的數據到活動字段，禁用其他字段

（4）當模糊活動字段，重新啓用其它場IF模糊字段空

這應包括四個。請注意，此示例使用jQuery，因此應包含jQuery庫（因爲它在下面的演示代碼中）。另外，jQuery代碼應該在document ready function之內。

$(document).ready(function(){ 
 

 
    $('input').focus(function(){ 
 
    $('input').not(this).prop('disabled',true); 
 
    }); 
 

 
    $('input').keyup(function(){ 
 
    var txt = $(this).val(); 
 
    if (txt.length < 1) $('input').prop('disabled', false); 
 
    else $('input').not(this).prop('disabled',true); 
 
    }); 
 

 
    $('input').blur(function(){ 
 
    var txt = $(this).val(); 
 
    if (txt.length < 1) $('input').prop('disabled', false); 
 
    }); 
 

 
}); //END document.ready

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
First name: <input type="text" name="fname" id="fname"><br> 
 
Last name: <input type="text" name="lname" id="lname"><br>

來源

2016-06-11 22:05:33 gibberish

您可以使用input event來實現自己的目標：

window.onload = function() { 
 
    var first = document.getElementById("fname"); 
 
    var last = document.getElementById("lname"); 
 
    first.addEventListener("input", function(e){ 
 
    last.disabled = this.value.trim().length != 0; 
 
    }); 
 
    last.addEventListener("input", function(e){ 
 
    first.disabled = this.value.trim().length != 0; 
 
    }); 
 
}

First name: <input type="text" name="fname" id="fname"><br> 
 
Last name: <input type="text" name="lname" id="lname"><br>

來源

2016-06-11 21:12:52 gaetanoM

刪除附加文本表單框文本時激活html文本表單框

回答

相關問題