HTML5表单验证与javascript篮子验证相结合？

Question

I'm working on this sample request forum which works with a basket, I've validated it by tweaking the form so that it uses HTML5 validation, that works dandy. But prior to changing the "a submit" button to an "input button", it used to stop the form submission if the basket had more than 5 items in it by using this:

<a href="javascript:closeFiveCheck();"> BUTTON </a>

So now it validates the form but will let you submit the request with more than 5 items, which we don't want, and if i change it back to the anchor link, the html5 fourm won't work, so I need a way to combine the two.

Here is the forum as a whole:

echo '<form name="SEARCH" id="SEARCH" method="POST" action="orderSamples.php" enctype="multipart/form-data">';
echo '<div class="mainBasketContact">';
echo '<a href="design-search.php"><img src="images/basketLong.png" /></a>';
echo '<p>Enter your details to receive your free samples. Please allow 7 working days for delivery.</p>';
echo '<div class="contactLabel">NAME</div><div class="contactLabel2"><input required="required" style="background:#'.$basketColour.';" type="text" name="NAME" id="NAME" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">COMPANY</div><div class="contactLabel2"><input style="background:#'.$basketColour.';" type="text" name="COMPANY" id="COMPANY" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">EMAIL</div><div class="contactLabel2"><input required="required" type="email" style="background:#'.$basketColour.';" name="EMAIL" id="EMAIL" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">TEL</div><div class="contactLabel2"><input type="number" required style="background:#'.$basketColour.';" name="TEL" id="TEL" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">PROJECT TITLE</div><div class="contactLabel2"><input style="background:#'.$basketColour.';" type="text" name="PROJECT" id="PROJECT" /></div><div style="clear: both;"></div>';
//echo '<div class="contactLabel">ADDRESS</div><div class="contactLabel2"><textarea style="background:#'.$basketColour.';" name="ADDRESS" id="ADDRESS" /></textarea></div><div style="clear: both;"></div>';

echo '<p class="dcHeader1">DELIVERY ADDRESS</p>';
echo '<div class="contactLabel">LINE 1</div><div class="contactLabel2"><input required="required" type="text" style="background:#'.$basketColour.';" name="AD1" id="AD1" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">LINE 2</div><div class="contactLabel2"><input type="text" style="background:#'.$basketColour.';" name="AD2" id="AD2" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">TOWN/CITY</div><div class="contactLabel2"><input required="required" type="text" style="background:#'.$basketColour.';" name="TOWN" id="TOWN" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">POSTCODE</div><div class="contactLabel2"><input required="required" type="text" style="background:#'.$basketColour.';" name="POSTCODE" id="POSTCODE" /></div><div style="clear: both;"></div>';
echo '<div class="contactLabel">FURTHER<br/>NOTES</div><div class="contactLabel2"><textarea name="MESSAGE" id="MESSAGE" style="background:#'.$basketColour.';"></textarea></div><div style="clear: both;"></div>';

echo '<input type="submit" name="Submit" value="SUBMIT" />';
echo '</div>';
echo '<div style="clear: both;"></div>';
echo '</div>';
echo '</form>';

I've had a fair look around and had no luck so far, if anyone has ANY suggestions please throw them my way! Thankyou! :)

Answer 1

只需在表单按钮上使用onclick属性，即可使其行为与之前的链接相同：

<input type="submit" name="Submit" value="SUBMIT" onclick="return closeFiveCheck();" />