實現:
1.用戶至少選中某項,即表示選中該行,同時該行的數據驗證通過,表單提交;否則,不提交。
html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>帶數據驗證和復選框的表單提交</title> <script src="../commonJqery/jquery-3.0.0.js" type="text/javascript"></script> <style type="text/css"> table { border-collapse: collapse; } td,th { width: 40px; height: 100px; border:1px solid #000; } table tbody tr:hover { background-color: red; } table tbody tr:not(:first-child):hover {background-color: #666; } td input[name='number']{ width: 100px; } </style> </head> <body> <form action="http://www.baidu.com" id="order_shopping" name="order_shopping" method="get" onsubmit="return checkShopping();"> <table id="table" class="fl"> <thead> <tr> <th>商品名</th> <th>單價</th> <th>購買數量</th> <th><input id="both" type="checkbox" name="both" autocomplete="off"></th> </tr> </thead> <tbody> <tr> <td>香蕉</td> <td>100</td> <td><input type="text" name="number" autocomplete="off" placeholder="請輸入數量"></td> <td> <input type="checkbox" name="choice" autocomplete="off"> </td> </tr> <tr> <td>蘋果</td> <td>100</td> <td><input type="text" name="number" autocomplete="off" placeholder="請輸入數量"></td> <td> <input type="checkbox" name="choice" autocomplete="off"> </td> </tr> </tbody> </table> <input type="submit" id="add_shopping" value="添加購物車"/> </form> <p id="msg"></p> </body> </html>
另外有需要云服務器可以了解下創(chuàng)新互聯scvps.cn,海內外云服務器15元起步,三天無理由+7*72小時售后在線,公司持有idc許可證,提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案,具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢,專為企業(yè)上云打造定制,能夠滿足用戶豐富、多元化的應用場景需求。
分享題目:基于JavaScript實現帶數據驗證和復選框的表單提交-創(chuàng)新互聯
網站網址:http://chinadenli.net/article18/goidp.html
成都網站建設公司_創(chuàng)新互聯,為您提供網站內鏈、域名注冊、軟件開發(fā)、網站設計公司、品牌網站設計、小程序開發(fā)
聲明:本網站發(fā)布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創(chuàng)新互聯