Javascript 克隆及；删除列表项，但如果它是'；什么是项目

我有一张表格，上面有美国各州的下拉列表

<ul class="stateSelector" id="stateSelector">
<li id="TemplateRow" class="state-dropdown-row">

    <span class="ua-dropdown">
      <select name="state[]" id="state" required data-parsley-error-message="* Please select a state">
      <option value="">Select State</option>
      <option value="AL">Alabama</option>
      <option value="AK">Alaska</option>
      <option value="AZ">Arizona</option>
      <option value="AR">Arkansas</option>
      <option value="CA">California</option>
      <option value="CO">Colorado</option>
      <option value="CT">Connecticut</option>
      <option value="DE">Delaware</option>
      <option value="DC">District of Columbia</option>
      <option value="FL">Florida</option>
      <option value="GA">Georgia</option>
      <option value="HI">Hawaii</option>
      <option value="ID">Idaho</option>
      <option value="IL">Illinois</option>
      <option value="IN">Indiana</option>
      <option value="IA">Iowa</option>
      <option value="KS">Kansas</option>
      <option value="KY">Kentucky</option>
      <option value="LA">Louisiana</option>
      <option value="ME">Maine</option>
      <option value="MD">Maryland</option>
      <option value="MA">Massachusetts</option>
      <option value="MI">Michigan</option>
      <option value="MN">Minnesota</option>
      <option value="MS">Mississippi</option>
      <option value="MO">Missouri</option>
      <option value="MT">Montana</option>
      <option value="NE">Nebraska</option>
      <option value="NV">Nevada</option>
      <option value="NH">New Hampshire</option>
      <option value="NJ">New Jersey</option>
      <option value="NM">New Mexico</option>
      <option value="NY">New York</option>
      <option value="NC">North Carolina</option>
      <option value="ND">North Dakota</option>
      <option value="OH">Ohio</option>
      <option value="OK">Oklahoma</option>
      <option value="OR">Oregon</option>
      <option value="PA">Pennsylvania</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="VT">Vermont</option>
      <option value="VA">Virginia</option>
      <option value="WA">Washington</option>
      <option value="WV">West Virginia</option>
      <option value="WI">Wisconsin</option>
      <option value="WY">Wyoming</option>
    </select>
    </span>

  <a href="#" name="DeleteBoxRow" class="DeleteBoxRow removeState  state-btn">Remove State</a>
</li>
<li>
  <div class="addState">
    <a href="#" id="AddAttr" name="AddAttr" class="clone state-btn">Add another State</a>
  </div>
</li>

选择状态
阿拉巴马州
阿拉斯加州
亚利桑那州
阿肯色州
加利福尼亚
科罗拉多州
康涅狄格州
特拉华州
哥伦比亚特区
佛罗里达州
佐治亚州
夏威夷
爱达荷州
伊利诺伊州
印第安纳州
爱荷华州
堪萨斯州
肯塔基州
路易斯安那州
缅因州
马里兰
马萨诸塞州
密歇根
明尼苏达州
密西西比
密苏里州
蒙大拿
内布拉斯加州
内华达州
新罕布什尔州
新泽西州
新墨西哥州
纽约
北卡罗来纳州
北达科他州
俄亥俄州
奥克拉荷马
俄勒冈
宾夕法尼亚
罗德岛
南卡罗来纳州
南达科他州
田纳西州
得克萨斯州
犹他州
佛蒙特州
弗吉尼亚州
华盛顿
西弗吉尼亚州
威斯康星州
怀俄明州

用户可以添加多个状态。有一些麻烦，在那里我可以添加几个状态，并允许第一个被删除，并有第二个成为第一等

我想让它表现得像

---

只要有多个项目，我如何克隆并允许删除第一个项目？

您可以评估是否有多个元素具有以下内容：

$('#stateSelector').delegate('.DeleteBoxRow', 'click', function() {
  if ($('#stateSelector li').length > 2) {
    $(this).closest('li').remove();
  } else {
    return false;
  }
});

---

编辑：

测试后，我发现如果删除第一个选择，则无法创建新的选择，这是因为您正在根据元素的

id

克隆元素，而可以克隆第一个元素：

var newRow = $('#stateSelector li').first().clone(true).removeAttr('id');

---

不错！如果我想更改“删除状态”的颜色，使其变灰以表示无法删除，该怎么办？轰！非常感谢。我深爱的男人：）