我已经在这里和其他任何地方无休止地看了一会儿，我无法弄清楚为什么我的Select2下拉框在我从下拉列表中单击后不会更改它们显示的值。
我正在尝试使用Select2设计woocommerce产品选择框 - 我将它们都设置为风格，但现在它们似乎并没有真正起作用。 我如何初始化我的两个盒子：
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<link href="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/css/select2.min.css" rel="stylesheet" />
<script src="//cdnjs.cloudflare.com/ajax/libs/select2/4.0.0/js/select2.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#current-rank").select2({
allowClear: true,
multiple: false,
width: 150
});
$("#desired-rank").select2({
allowClear: true,
multiple: false,
width: 150
});
});
</script>
与下拉列表相关的产品页面的HTML -WITH SELECT2 ENABLED-（所以我的所有选项都有一个Select2应该可以使用的ID ...）
<td class="value">
<select id="current-rank" name="attribute_current-rank" data-attribute_name="attribute_current-rank" tabindex="-1" class="select2-hidden-accessible" aria-hidden="true">
<option id="select-a-rank" selected="selected" value="select-a-rank">Select a Rank</option> <option id="rank-2" value="rank-2">Rank 2</option> <option id="rank-3" value="rank-3">Rank 3</option> <option id="rank-4" value="rank-4">Rank 4</option> <option id="rank-5" value="rank-5">Rank 5</option> <option id="rank-6" value="rank-6">Rank 6</option> <option id="rank-7" value="rank-7">Rank 7</option> <option id="rank-8" value="rank-8">Rank 8</option> <option id="rank-9" value="rank-9">Rank 9</option> <option id="rank-10" value="rank-10">Rank 10</option> <option id="rank-11" value="rank-11">Rank 11</option> <option id="rank-12" value="rank-12">Rank 12</option> <option id="rank-13" value="rank-13">Rank 13</option> <option id="rank-14" value="rank-14">Rank 14</option> <option id="rank-15" value="rank-15">Rank 15</option> <option id="rank-16" value="rank-16">Rank 16</option> <option id="rank-17" value="rank-17">Rank 17</option> <option id="rank-18" value="rank-18">Rank 18</option> <option id="rank-19" value="rank-19">Rank 19</option> <option id="rank-20" value="rank-20">Rank 20</option> <option id="rank-21" value="rank-21">Rank 21</option> <option id="rank-22" value="rank-22">Rank 22</option> <option id="rank-23" value="rank-23">Rank 23</option> <option id="rank-24" value="rank-24">Rank 24</option> <option id="rank-25" value="rank-25">Rank 25</option> <option id="rank-26" value="rank-26">Rank 26</option> <option id="rank-27" value="rank-27">Rank 27</option> <option id="rank-28" value="rank-28">Rank 28</option> <option id="rank-29" value="rank-29">Rank 29</option> <option id="rank-30" value="rank-30">Rank 30</option> <option id="rank-31" value="rank-31">Rank 31</option> <option id="rank-32" value="rank-32">Rank 32</option> <option id="rank-33" value="rank-33">Rank 33</option> <option id="rank-34" value="rank-34">Rank 34</option> <option id="rank-35" value="rank-35">Rank 35</option> <option id="rank-36" value="rank-36">Rank 36</option> <option id="rank-37" value="rank-37">Rank 37</option> <option id="rank-38" value="rank-38">Rank 38</option> <option id="rank-39" value="rank-39">Rank 39</option> <option id="rank-40" value="rank-40">Rank 40</option> <option id="rank-41" value="rank-41">Rank 41</option> <option id="rank-42" value="rank-42">Rank 42</option> <option id="rank-43" value="rank-43">Rank 43</option> <option id="rank-44" value="rank-44">Rank 44</option> <option id="rank-45" value="rank-45">Rank 45</option> <option id="rank-46" value="rank-46">Rank 46</option> <option id="rank-47" value="rank-47">Rank 47</option> <option id="rank-48" value="rank-48">Rank 48</option> <option id="rank-49" value="rank-49">Rank 49</option> <option id="rank-50" value="rank-50">Rank 50</option>
</select>
<span class="select2 select2-container select2-container--default select2-container--below" dir="ltr" style="width: 150px;">
<span class="selection">
<span class="select2-selection select2-selection--single" role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-expanded="false" tabindex="0" aria-labelledby="select2-current-rank-container">
<span class="select2-selection__rendered" id="select2-current-rank-container" title="Select a Rank">
<span class="select2-selection__clear">×</span>Select a Rank
</span>
<span class="select2-selection__arrow" role="presentation">
<b role="presentation"></b>
</span>
</span>
</span>
<span class="dropdown-wrapper" aria-hidden="true"></span>
</span>
</td>
产品页面的HTML SELECT2 SCRIPT DISABLED
<td class="value"><select id="current-rank" name="attribute_current-rank" data-attribute_name="attribute_current-rank">
<option id="select-a-rank" selected="selected" value="select-a-rank">Select a Rank</option>
<option id="rank-2" value="rank-2" class="attached enabled">Rank 2</option>
<option id="rank-3" value="rank-3" class="attached enabled">Rank 3</option>
<option id="rank-4" value="rank-4" class="attached enabled">Rank 4</option>
<option id="rank-5" value="rank-5" class="attached enabled">Rank 5</option>
<option id="rank-6" value="rank-6" class="attached enabled">Rank 6</option>
<option id="rank-7" value="rank-7" class="attached enabled">Rank 7</option>
<option id="rank-8" value="rank-8" class="attached enabled">Rank 8</option>
<option id="rank-9" value="rank-9" class="attached enabled">Rank 9</option>
<option id="rank-10" value="rank-10" class="attached enabled">Rank 10</option>
<option id="rank-11" value="rank-11" class="attached enabled">Rank 11</option>
<option id="rank-12" value="rank-12" class="attached enabled">Rank 12</option>
<option id="rank-13" value="rank-13" class="attached enabled">Rank 13</option>
<option id="rank-14" value="rank-14" class="attached enabled">Rank 14</option>
<option id="rank-15" value="rank-15" class="attached enabled">Rank 15</option>
<option id="rank-16" value="rank-16" class="attached enabled">Rank 16</option>
<option id="rank-17" value="rank-17" class="attached enabled">Rank 17</option>
<option id="rank-18" value="rank-18" class="attached enabled">Rank 18</option>
<option id="rank-19" value="rank-19" class="attached enabled">Rank 19</option>
<option id="rank-20" value="rank-20" class="attached enabled">Rank 20</option>
<option id="rank-21" value="rank-21" class="attached enabled">Rank 21</option>
<option id="rank-22" value="rank-22" class="attached enabled">Rank 22</option>
<option id="rank-23" value="rank-23" class="attached enabled">Rank 23</option>
<option id="rank-24" value="rank-24" class="attached enabled">Rank 24</option>
<option id="rank-25" value="rank-25" class="attached enabled">Rank 25</option>
<option id="rank-26" value="rank-26" class="attached enabled">Rank 26</option>
<option id="rank-27" value="rank-27" class="attached enabled">Rank 27</option>
<option id="rank-28" value="rank-28" class="attached enabled">Rank 28</option>
<option id="rank-29" value="rank-29" class="attached enabled">Rank 29</option>
<option id="rank-30" value="rank-30" class="attached enabled">Rank 30</option>
<option id="rank-31" value="rank-31" class="attached enabled">Rank 31</option>
<option id="rank-32" value="rank-32" class="attached enabled">Rank 32</option>
<option id="rank-33" value="rank-33" class="attached enabled">Rank 33</option>
<option id="rank-34" value="rank-34" class="attached enabled">Rank 34</option>
<option id="rank-35" value="rank-35" class="attached enabled">Rank 35</option>
<option id="rank-36" value="rank-36" class="attached enabled">Rank 36</option>
<option id="rank-37" value="rank-37" class="attached enabled">Rank 37</option>
<option id="rank-38" value="rank-38" class="attached enabled">Rank 38</option>
<option id="rank-39" value="rank-39" class="attached enabled">Rank 39</option>
<option id="rank-40" value="rank-40" class="attached enabled">Rank 40</option>
<option id="rank-41" value="rank-41" class="attached enabled">Rank 41</option>
<option id="rank-42" value="rank-42" class="attached enabled">Rank 42</option>
<option id="rank-43" value="rank-43" class="attached enabled">Rank 43</option>
<option id="rank-44" value="rank-44" class="attached enabled">Rank 44</option>
<option id="rank-45" value="rank-45" class="attached enabled">Rank 45</option>
<option id="rank-46" value="rank-46" class="attached enabled">Rank 46</option>
<option id="rank-47" value="rank-47" class="attached enabled">Rank 47</option>
<option id="rank-48" value="rank-48" class="attached enabled">Rank 48</option>
<option id="rank-49" value="rank-49" class="attached enabled">Rank 49</option>
<option id="rank-50" value="rank-50" class="attached enabled">Rank 50</option>
</select> </td>
我不知道为什么这不起作用，我发现的主要问题是Select2没有ID来调用项目，但我确保在加载页面时由WooCommerce生成ID
我不认为Select2：选择是解雇，但不确定为什么，选择＆＃34;选择＆＃34;单击项目时未更改。