こんにちは！
状態の省略形（つまり「ks」）をさらに多くのアイテムに収集する新しいHTMLフォームをコーディングしています。現在、-inputフィールド-が制限されているため、2文字しか使用できません。それは、訪問者が「SS」のようなランダムなものをフィールドに入力することを妨げません。
そのフィールドに配置できるものを米国の公式の州の略語のみに制限できるコードが必要です。
これまでのところ、自分のWebサイトでHTML、CSS、およびJavascriptを使用しています。たくさんのご協力とアイデアをありがとうございました！
<select>html要素を使用できます。
<select>
<option value="MA">MA<option>
....
</select>
アップデート。すべての状態、大文字の処理、およびjsfiddleリンクを追加しました。
これは純粋なjavascriptの実装であり、何をする必要があるかを理解できるはずです。
<script>
function validateState(el) {
//put all states in this array.
var states = ["AK","AL","AR","AS","AZ","CA","CO","CT","DC","DE",
"FL","GA","GU","HI","IA",
"ID","IL","IN","KS","KY","LA","MA","MD","ME","MH","MI","MN","MO","MS","MT",
"NC","ND","NE","NH","NJ","NM","NV","NY","OH","OK","OR","PA","PR","PW","RI",
"SC","SD","TN","TX","UT","VA","VI","VT","WA","WI","WV","WY"];
for(var i=0;i< states.length;i++) {
if(el.value.toUpperCase() == states[i]) {
return true;
}
}
//clear element if it doesn't match a state
el.value = ""; //you could maybe do something else here.
return false;
}
</script>
<input class="up" type="text" maxlength="2" onchange="validateState(this);"/>
ここでライブで動作することを確認してください：http：//jsfiddle.net/k7QQs/
スクリプトなしでそれを行うことができます：
<select name="state">
<option value="" selected>Please Select</option>
<option value="AK">Alaska</option>
<option value="AL">Alabama</option>
<option value="AR">Arkansas</option>
<option value="AS">American Samoa</option>
<option value="AZ">Arizona</option>
<option value="CA">California</option>
<option value="CO">Colorada</option>
<option value="CT">Conneticut</option>
<option value="DC">District of Colombia</option>
<option value="DE">Delaware</option>
<option value="FL">Florida</option>
<option value="FM">Federated States</option>
<option value="GA">Georgia</option>
<option value="GU">Guam</option>
<option value="HI">Hawaii</option>
<option value="IA">Iowa</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="MA">Massachusetts</option>
<option value="MD">Maryland</option>
<option value="ME">Maine</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MO">Missouri</option>
<option value="MS">Mississippi</option>
<option value="MT">Montana</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="NE">Nebraska</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NV">Nevada</option>
<option value="NY">New York</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="PR">Puerto Rico</option>
<option value="RI">Rhode Island</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VI">Virgin Islands</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WI">Wisconsin</option>
<option value="WV">West Virginia</option>
<option value="WY">Wyoming</option>
</select>
この方法は、ユーザーが州の略語を知っていると期待するよりも簡単です。
または-
function validState(state){
return state.toUpperCase() in{
AL:1, AK:1, AZ:1,
AR:1, CA:1, CO:1, CT:1,
DE:1, DC:1, FL:1, GA:1,
HI:1, ID:1, IL:1, IN:1, IA:1,
KS:1, KY:1, LA:1, ME:1, MD:1,
MA:1, MI:1,
MN:1, MS:1, MO:1, MT:1, NE:1,
NV:1, NH:1, NJ:1, NM:1,
NY:1, NC:1, ND:1,
OH:1, OK:1, OR:1, PA:1,
RI:1, SC:1, SD:1, TN:1, TX:1,
UT:1, VT:1, VA:1, WA:1,
WV:1, WI:1, WY:1
}
}