0

你好！

我正在编写一个新的 HTML 表单，它将收集更多项目的状态缩写（即“ks”）。现在我有 -input 字段限制，所以它只允许 2 个字符。这并不能阻止访问者在“SS”之类的字段中随机输入一些内容。

我想要一个代码，允许我将可以在该字段中放置的内容限制为仅美国的官方州缩写。

到目前为止，我在我的网站中使用 HTML、CSS 和 Javascript。感谢您的所有帮助和想法！

4

4 回答 4

1

更新。添加了所有状态、大写处理和 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/

于 2013-01-28T04:23:35.433 回答
1

您可以使用<select>html 元素。

<select>
  <option value="MA">MA<option>
  ....
</select>
于 2013-01-28T04:16:39.820 回答
0

我认为这会有所帮助。

它有：

mustMatch:true,
于 2013-01-28T04:15:54.723 回答
0

您可以在没有脚本的情况下执行此操作：

<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
    }
}
于 2013-01-28T04:33:20.240 回答