text
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>jQuery 取得資料範例</title> <script src="https://code.jquery.com/jquery-3.6.4.min.js"></script></head><body> <input type="text" id="textInput" value="Hello, World!"> <button id="getTextBtn">取得文字框的值</button> <script> $(document).ready(function(){ $('#getTextBtn').click(function(){ var textValue = $('#textInput').val(); alert('文字框的值是：' + textValue); }); }); </script></body></html>
textarea
<!-- 在上面的 HTML 檔案中加入以下程式碼 --><select id="selectOption"> <option value="option1">選項1</option> <option value="option2" selected>選項2</option> <option value="option3">選項3</option></select><button id="getSelectBtn">取得選擇框的值</button><script> $(document).ready(function(){ $('#getSelectBtn').click(function(){ var selectedOption = $('#selectOption').val(); alert('選擇的值是：' + selectedOption); }); });</script>
select
<!-- 在上面的 HTML 檔案中加入以下程式碼 --><select id="selectOption"> <option value="option1">選項1</option> <option value="option2" selected>選項2</option> <option value="option3">選項3</option></select><button id="getSelectBtn">取得選擇框的值</button><script> $(document).ready(function(){ $('#getSelectBtn').click(function(){ var selectedOption = $('#selectOption').val(); alert('選擇的值是：' + selectedOption); }); });</script>
<!-- 在上面的 HTML 檔案中加入以下程式碼 --><input type="radio" name="gender" value="male" id="maleRadio"> 男<input type="radio" name="gender" value="female" id="femaleRadio"> 女<button id="getRadioBtn">取得單選按鈕的值</button><script> $(document).ready(function(){ $('#getRadioBtn').click(function(){ var selectedGender = $('input[name="gender"]:checked').val(); alert('選擇的性別是：' + selectedGender); }); });</script>
<!-- 在上面的 HTML 檔案中加入以下程式碼 --><input type="checkbox" id="checkbox1" value="value1"> 選項1<input type="checkbox" id="checkbox2" value="value2" checked> 選項2<button id="getCheckboxBtn">取得複選框的值</button><script> $(document).ready(function(){ $('#getCheckboxBtn').click(function(){ var checkboxValues = []; $('input[type="checkbox"]:checked').each(function(){ checkboxValues.push($(this).val()); }); alert('選擇的複選框值是：' + checkboxValues.join(', ')); var isChecked = $("#checkbox2").is(":checked"); if (isChecked) { //有選取 } else { //未選取 } }); });</script>
留言
張貼留言