在Javascript中，如何更改警報窗口以在輸入框旁邊顯示該警報

Question

我和我的朋友正在制作一個數據驗證程序。 如果輸入程序不接受的數據（例如，在名稱字段中輸入數字），則會顯示Windows警報，提示您無效。 我們決定要更改此設置，以便代替Windows警報，在每個表單元素右側將顯示一個空表單元格，以顯示您的數據無效。 我該如何更改？ 下面附上代碼。

function fNameValidation()
{
if (document.forms[0].fName.value.length==0)                //First name data validation
{                                                           //check for any entry
alert('Please enter your first name.');
document.forms[0].fName.focus();
return;
}

Answer 1

在具有唯一ID的輸入字段旁邊放置一個span元素，然后可以將Text插入該特定字段：

document.getElementById('firstNameError').innerHTML = "Please enter your first name.";

Answer 2

最簡單的方法是設置此單元格的ID：

<td id="nameErrorCell">
    (...)
</td>

並且比您的javascript：

var cell = document.getElementById('nameErrorCell');
cell.innerHTML="error message";

Answer 3

您還可以將DOM樹向上移動到<td>元素，然后到其同級，並使用錯誤消息更改其innerHTML 。

document.forms[0].fName.parentNode.nextSibling.innerHTML = 'Please enter your first name.');

如果<input>和<td>之間有元素，請添加更多.parentNode 。