Html-CheckBox 多選選單操作

我們要如何製作一個簡單的單選選單？
要如何取到選單對應的參數？
此篇文章會提到如何使用 JS (JavaScript), JQ (JQuery)

A
B
C

<form>
    <input type="checkbox" name="vehicle" value="0">A<br>
    <input type="checkbox" name="vehicle" value="1">B<br>
    <input type="checkbox" name="vehicle" value="2">C<br>
</form>

如何取出 select radioBox value ?

var valuelist = ''; 

$('input[name="vehicle"]:checked').each(function() {
    valuelist += this.value + ',';
});

Html-RadioBox 單選選單操作

我們要如何製作一個簡單的單選選單？
要如何取到選單對應的參數？
此篇文章會提到如何使用 JS (JavaScript), JQ (JQuery)

Male
Female
Other

<form>
      <input type="radio" name="gender" value="male" checked> Male<br>
      <input type="radio" name="gender" value="female"> Female<br>
      <input type="radio" name="gender" value="other"> Other
</form>

如何取出 select radioBox value ?

var radioVar = $('input[name=gender]:checked').val();

Html-Option 下拉選單操作

我們要如何製作一個簡單的下拉選單？

要如何取到選單對應的參數？文字？

此篇文章會提到如何使用 JS (JavaScript), JQ (JQuery)

以下是範例 ：

請選擇 a b c d

<select id="selectId" onchange="changeOption();">
  <option value="0">請選擇</option>
  <option value="1">a</option>
  <option value="2">b</option>
  <option value="3">c</option>
  <option value="4">d</option>
</select>

如何取出 select option value ?

var optionVar = $('#selectId').val();

如何取出 select option text ?

var optionText = $('#selectId option:selected').text();

如何設置被選擇的參數 ?

$("#selectId").val("2").change();

JavaScript-檢查 Form 內部元件是否為空

check form is null
參考資料：JS form check empty

JQuery-遇到的問題彙整

身分證
http://liaosankai.pixnet.net/blog/post/24165900-%E8%BA%AB%E4%BB%BD%E8%AD%89%E9%A9%97%E8%AD%89%E7%A8%8B%E5%BC%8F-for-javascript-(%E7%B2%BE%E7%B0%A1%E7%89%88)

checkbox radio 參數 (name : Jaskaran singh Rajal)
http://stackoverflow.com/questions/2834350/get-checkbox-value-in-jquery

Two listBox
http://esausilva.com/2016/01/29/move-items-between-two-listbox-using-jquery-html-select-tag/

日期元件
https://www.w3schools.com/jsref/tryit.asp?filename=tryjsref_input_date_value2
日期檢查
http://www.jquerybyexample.net/2011/10/validate-date-format-using-jquery.html

JQuery-基本 用法

要用 JQuery 前我們要先簡單了解這是什麼東西？

他是以 JavaScript 為基礎的 Library。

那在開發上和  JavaScript 有什麼差異？

最主要是改善在使用 JavaScript 的一些不便利。而且也能讓開發

者更有效率的去開發，且內部也有大量的 UI 元件可以使用。

首先是前準備的工具：

參考資料：jQuery 教學 - 基礎篇
參考資料：JQuery

歡迎轉載，請註明出處。