php - 启用所有选择选项直到 selectedIndex

Question

向代码杂耍者致敬!

我正在处理一个有点令人沮丧的问题，我似乎无法 100% 解决它，我希望它能正常工作。

我有一个选择字段，其中包含各种动态选项数量(可能不止一个“中间”，例如“中间 1”、“中间 2”)由 php 停用并获取和构建。用户必须输入一个数字来激活和预选特定的选择选项。到目前为止，它可以正常工作，它会根据用户输入预先选择选项。但我希望它在预选上方启用每个选择选项。

$(document).ready(function() {
    // PRE-SELECT TPOS BASED ON TMEMBER
    $('#inputX').change(function() {
        var member_id = $('#inputX').val();
        // FETCHED BY PHP, NO NEED TO OVERRIDE (WORKS)
	var event_id = <? echo $event_id; ?>;
	var posit_id = <? echo $posit_id; ?>;
				
        // FETCH CURRENT POSITION, MEMBER IS AT
	$.ajax({
            type: 'POST',
            url: 'fetch_pos.php',
            data: {
                   posit_id: posit_id,
                   event_id: event_id,
                   member_id: member_id
                  },
            // GET SELECT OPTION WITH POSITION VALUE MEMBER IS AT [E. G. "START"]
            success: function(html){
                // ENABLE SELECT OPTION
                $("#selectX option[value='" + html + "']").attr("disabled", false);
                // ADD SELECTED ATTRIBUTE
                $("#selectX").val(html).setAttribute("selected", "selected");
				
                // DISABLE EVERY OPTION PAST THE RETURNED VALUE AND
                // ENABLE EVERY "PREVIOUS" OPTION
                $('select#selectX').val(html).children().attr("disabled", false).filter(':selected').nextAll().prop('disabled', true);
            }
        }); 
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
    <input type="text" name="inputX" id="inputX" required="required" />
    <select name="selectX" id="selectX" required="required">
        <option selected="selected">Awaiting Input</option>
        <option disabled="disabled" value="Start">Start</option>
        <option disabled="disabled" value="Middle">Middle</option>
        <option disabled="disabled" value="Last">Last</option>
    </select>
</form>

AJAX 的返回值是选项值之一，因为我的代码需要使用它们而不是整数 1、2 或 3(+)。

例如:我有相同的选择字段，但 ID 号为 3 的成员位于目标位置。所以应该启用“目标”、“中间”和“开始”。如果 3 号成员位于中间位置，我希望仅启用“开始”和“中间”。

有什么帮助吗？

真诚的，蒙特利尔

编辑

因为误解:忽略了AJAX。它只是返回值作为成员的位置，因为选项值是这样定义的 --> E. G. ID 为 1 的成员位于“中间”位置，因此选项值 =“中间”和所有之前 (option value="start") 应该启用。

我只想启用基于返回值所选选项减去选项总数的 selectIndex 的每个选项。

例子:3个选项返回值为“中间”，因此 selectIndex 1应该启用带有 selectIndex 0 和 1 的选择选项

Answer 1

我认为您正在寻找类似的东西:

$('select#test')
  //set new value on select
  .val('4')
  // enable all children
  .children().prop('disabled', false)
  // starting at selected option, disable all after it
  .filter(':selected').nextAll().prop('disabled', true)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="test" size="10">
  <option value="1">item 1</option>
  <option value="2">item 2</option>
  <option value="3">item 3</option>
  <option value="4">item 4</option>
  <option value="5">item 5</option>
  <option value="6">item 6</option>
  <option value="7">item 7</option>
  <option value="8">item 8</option>
  <option value="9">item 9</option>
  <option value="10">item 10</option>
</select>