HTML5表單驗證與javascript籃子驗證相結合？

Question

我正在與籃子一起使用的這個示例請求論壇上進行工作，我已經通過調整表單進行了驗證，以便它使用HTML5驗證，而且非常有用。 但是在將“提交”按鈕更改為“輸入按鈕”之前，如果購物籃中包含超過5個項目，它會使用以下方法停止提交表單：

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

因此，現在它可以驗證表單，但可以讓您提交超過5個項目的請求，這是我們不想要的，如果我將其更改回錨鏈接，則html5 fourm將無法工作，因此我需要一種方法結合兩者。

這里是整個論壇：

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>';

我環顧四周，到目前為止還沒有運氣，如果有人有任何建議，請把它們扔給我！ 謝謝！ :)

Answer 1

只需在表單按鈕上使用onclick屬性，即可使其行為與之前的鏈接相同：

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