Jquery是一種非常流行的JavaScript庫,可以讓頁面變得更加豐富和動態。其中,表單提交是網頁開發中非常重要的一個環節。在Jquery中,我們可以很方便地將表單提交到表格中。
下面是一個簡單的示例代碼:
<html> <head> <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script> $(document).ready(function(){ $("#submitBtn").click(function(){ var name = $("#name").val(); var age = $("#age").val(); var gender = $("input[name='gender']:checked").val(); var newRow = "<tr><td>" + name + "</td><td>" + age + "</td><td>" + gender + "</td></tr>"; $("#dataTable tbody").append(newRow); }); }); </script> </head> <body> <form> Name: <input type="text" id="name"><br> Age: <input type="text" id="age"><br> Gender: <input type="radio" name="gender" value="male">Male <input type="radio" name="gender" value="female">Female <br> <input type="button" id="submitBtn" value="Submit"> </form> <table id="dataTable" border="1"> <thead> <tr><th>Name</th><th>Age</th><th>Gender</th></tr> </thead> <tbody></tbody> </table> </body> </html>
在這段代碼中,我們使用Jquery的方法來添加一個點擊事件,當用戶點擊"Submit"按鈕時,表格會自動添加一行并填入表單中的內容。
在Jquery中,我們可以輕松地處理表單和表格中的數據,并進行動態的展示和操作。這無疑會給網頁開發帶來更高的效率和更好的用戶體驗。