<form action='' method='POST' id='myForm'>
	<input type='text' name='aaa' id='aaa' />
	<input type='text' name='output' id='output' />
	<input type='submit' name='one' value='按鈕01' />
	<input type='submit' name='two' value='按鈕02' />
</form>

我在此表單內的 aaa 欄位輸入數據後，用 change 事件來計算並設定 output 欄位的值，然後在送出表單後會用 PHP 判斷按下的是哪個送出按鈕，再對 output 欄位的值做不同的計算。

通常會在 aaa 欄位輸入完數據後，在空白處點一下離開該元素，等 change 執行完成並設定好 output 欄位的值之後再去按送出按鈕。

但如果有使用者在 aaa 欄位一輸入完數據，就直接去按送出按鈕，想請問：

1. 瀏覽器會保證 output 欄位的值是在設定完成之後才送出表單嗎？

2. 如果 change 事件內有用到 ajax 計算 output 欄位的值的話，如何保證 ajax 設定完成 output 欄位的值之後才送出表單？

謝謝！

以下是 javascript 程式碼

'use strict';
var aaa = document.getElementById('aaa'),
	output = document.getElementById('output'),
	myForm = document.getElementById('myForm');
function fn_change(){
	var ajax = new XMLHttpRequest();
	ajax.onreadystatechange = function(){
		if( ajax.readyState !== 4 ){ return; }
		if( ( ajax.status >= 200 && ajax.status < 300 ) || ajax.status == 304 ){
			output.value = aaa.value + ajax.responseText;
		}
		else{
			alert( 'ajax 回傳錯誤： ' + ajax.statusText );
		}
	};
	ajax.open('POST', 'ajax-data.php', true);
	ajax.send(null);
}

aaa.onchange = fn_change;