验证表单时 Javascript 函数运行两次

Question

我确信对此必须有一个简单的解释。我试图在选择“未选择”选项(我相信默认情况下已选择)时显示“必须选择国家/地区”警报，然后单击验证按钮。我已经能够正确显示警报的功能，但问题是警报显示两次。

为什么警报显示两次，如何让它只显示一次？谢谢!

function CountrySelectValidation() { // ensures country is selected
	var ValidateCountry = document.forms["registration-form"]["Country"].value;
	if (ValidateCountry == "not-selected") {
		alert("Country must be selected");
		return false;
	} else {
		return true;
	}
}

function SubmitForm() {
    if (CountrySelectValidation()) {
        // check if true, then execute this code
        document.getElementById("registration-form").submit();	
    }
}

<form id="registration-form">
    What country are you from?
    <select name="Country">
		<option value="not-selected">Not Selected</option>
		<option value="england">England</option>
		<option value="wales">Wales</option>
		<option value="scotland">Scotland</option>
		<option value="northern-ireland">Northern Ireland</option>
	</select>
    <br><br><input type="submit" value="Submit Method 1">
    <button type="reset">Reset Method 1</button>
    <button type="submit" id="submit-2">Submit Method 2</button>
</form>

<button onClick="ResetForm()">Reset Method 1</button>
<button onClick="CountrySelectValidation(); SubmitForm()">Validation</button>

Answer 1

CountrySelectValidation()
...
if (CountrySelectValidation())

您在 if 中运行 CountrySelectValidation 函数(它实际执行)，因此这就是它运行两次的原因。