Struts2でjsファイルの動作が上手くいかない

###前提・実現したいこと
EclipseでStruts2を使えるように、TODO管理アプリケーション開発の教材を使って勉強をしている初心者です。
Struts2を使う前にTODO管理アプリケーション開発をServletやJSPを使った基本的な作り方でも作っています。
実現したいことは、JavaScriptを使ってログインページでユーザーがIDとパスワードを入力するまでログインボタンを無効にして、IDとパスワードの入力を確認すると有効になるようにすることです。

###発生している問題

事前に作ったTODO管理アプリケーションではjsファイルを読み込んだJavaScriptは上手く動作していたのですが、Struts2を使って作ったTODO管理アプリケーションではjsファイルから読み込んだJavaScriptの動作が望んだ通りになりません。
自分でも調べてみて、原因はJavaScriptの関数の呼び出しが上手くいってないことだと思うのですが、どうして上手くいかないのかわかりませんでした。
どなたかご教示ください。
よろしくお願いします。

###該当のソースコード

jsファイル login.js


// フィールドが変更された場合に処理する関数
function fieldChanged(){
    var userId = getField("user_id");
    var password = getField("password");
    var disabled = true;

    if (userId.value.length > 0 && password.value.length > 0) {
        disabled = false;
    }

    var login = getField("login");
    if (disabled) {
        login.setAttribute("disabled", "disabled");
    }
    else {
        login.removeAttribute("disabled");
    }
}

// フィールドを取得する関数
function getField(fieldName){
    var field = document.getElementById(fieldName);
    if (field == undefined) {
        throw new Error("要素が見つかりません: " + fieldName);
    }
    return field;
}

Strtus2時のJSPファイル login.jsp (JavaScript動作失敗)


<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="s" uri="/struts-tags" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ログイン</title>
<link rel="STYLESHEET" href="todo.css" type="text/css">
<script type="text/javascript" src="login.js">
</script>
</head>
<body onload="fieldChanged();">  //---------------------ここで関数を呼び出す
	<h1>ログイン</h1>
	<hr>
	<div align="center">
		<s:form action="login_action">
			<s:textfield name="user_id" value="" size="24"
						label="ユーザID" onkeyup="fieldChanged();" onchange="fieldChanged();" />
						<s:password name="password" value="" size="24"
								label="パスワード" onkeyup="fieldChanged();" onchange="fieldChanged();" />
					<s:submit value="ログイン" id="" align="center"/>
		</s:form>
	</div>
</body>
</html>

事前に作ったJSP login.jsp (JavaScript動作成功)

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ログイン</title>
<link rel="stylesheet" href="todo.css" type="text/css">
<script type="text/javascript" src="login.js">
</script>
</head>
<body onload="fieldChanged();">
	<h1>ログイン</h1>
	<hr>
		<div align="center">
			<table border="0">
				<form action="Todo" method="post" >
					<input type="hidden" name="action" value="login_action">
					<tr>
						<th class="login_field">
							ユーザーID
						</th>
						<td class="login_field">
							<input type="text" name="user_id" value="" size="24"
							 id="user_id" onkeyup="fieldChanged();" onchange="fieldChanged();">
						</td>
					</tr>
					<tr>
						<th class="login_field">
							パスワード
						</th>
						<td class="login_field">
							<input type="password" name="password" value="" size="24"
							 id="password" onkeyup="fieldChanged();" onchange="fieldChanged();">
						</td>
					</tr>
					<tr>
						<td colspan="2" class="login_button">
							<input type="submit" value="ログイン" id="login">
						</td>
					</tr>
				</form>
			</table>
		</div>
</body>
</html>

###試したこと

ブラウザのインターネットオプションでセキュリティレベルの引き下げ。動作失敗。
ネットに紹介されていた方法でfunctionの前にwindou.onload=を付け足す。動作失敗。
Eclipseでjsファイルを作る時はコピペではなく、直接作らないと上手くいかないとネットで紹介されていたので、改めて一から作り直した。動作失敗。
jsファイルの各所にalert("test〇");を付け足してどこで動作が止まっているのかの確認。

// フィールドが変更された場合に処理する関数

function fieldChanged(){
	alert("test1");
    var userId = getField("user_id");
	alert("test2");
    var password = getField("password");
	alert("test3");
   var disabled = true;

	alert("test4");
    if (userId.value.length > 0 && password.value.length > 0) {
    	alert("test5");
        disabled = false;
    }

	alert("test6");
    var login = getField("login");
    if (disabled) {
    	alert("test7");
        login.setAttribute("disabled", "disabled");
    }
    else {
    	alert("test8");
        login.removeAttribute("disabled");
    }
}

// フィールドを取得する関数
function getField(fieldName){
	alert("testA");
    var field = document.getElementById(fieldName);
	alert("testB");
    if (field == undefined) {
    	alert("testC");  //--------------------------------ここで止まる
       throw new Error("要素が見つかりません: " + fieldName);
    }
	alert("testD");
    return field;
}

確認してみるとStruts2では"test1"から"testA"に移って"testC"で止まっているようなのですが、そこからどうすればいいのかが悩んでいます。

###補足情報(言語/FW/ツール等のバージョンなど)

Eclipse

pleiades-e4.6-java-jre_20160622

Struts2 --- struts-2.1.6

commons-fileupload-1.2.1.jar
commons-io-1.3.2.jar
commons-logging-1.0.4.jar
freemarker-2.3.13.jar
ognl-2.6.11.jar
struts2-core-2.1.6.jar
xwork-2.1.2.jar