jQuery PrevAll不能与Select Option一起使用

时间:2017-03-11 15:39:05

标签: javascript jquery

出于某种原因,我似乎不能使prevAll使用选择框的选项。

我在这里尝试做的是将omday之前的所有选项标记为已禁用。

JQ是否忽略它或我的代码是否存在问题?

这是我的代码:



jQuery(document).ready(function($) {
  var omday = 25;
  $('#inc-day').val(omday);
  $("#inc-day option").prevAll('#inc-day option[value="' + omday + '"]').prop('disabled', true);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<select class="incrange" id="inc-day" name="inc-day"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option></select>
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

首先使用选择器捕获实际选择的选项,然后使用prevAll()函数禁用所选选项之前的每个option元素。

$(document).ready(function() {
  var omday = 25;
  $('#inc-day').val(omday);
  $('#inc-day option[value="' + omday + '"]').prevAll().prop('disabled', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<select class="incrange" id="inc-day" name="inc-day"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option></select>

答案 1 :(得分:0)

如果您的目标是使用omday变量中的值禁用选项之前的选项,则需要选择该选项,然后使用prevAll获取其先前的兄弟:

$('#inc-day option[value="' + omday + '"]').prevAll().prop('disabled', true);

jQuery(document).ready(function($) {
  var omday = 25;
  $('#inc-day').val(omday);
  $('#inc-day option[value="' + omday + '"]').prevAll().prop('disabled', true);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<select class="incrange" id="inc-day" name="inc-day"><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option></select>

您的版本无法正常运行,因为它选择了所有选项,然后尝试查找具有omday值的所有兄弟姐妹。