Как я могу выбрать элемент из меню опций, если у меня есть один элемент

Question

Я хочу выбрать элемент из меню выбора опций, когда у меня есть только один элемент для использования в моей следующей функции ($ ('#'). On («изменение», функция() {}))

это работа, когда у меня есть более чем один пункт в меню, но если есть один пункт, когда я нажав на что один пункт нет никакого результата:

из базового элемента один = [1] два = [1,2] и три = [1,2,3], это нормально для выбора двух и трех, но не для первого пункта, у меня есть только одно число внутри

HTML

<select id = "fir"> 
<option>one</option> 
<option>two</option> 
<option>three</option> 
</select> 

<select id="sec" > 
<option ></option> 
</select> 

<input id="tbl_S2" type="text" > 

JavaScript

$('#fir').on("click", function() { 
    var schem =$("#fir").val(); 

    $.ajax({ 
    type: 'GET', 
    url:'url/'+schem, 
    success:function(data2){ 
     $("#sec").empty(); 
     for (var i = 0; i < data2.length; i++) { 
     $("#sec").append("<option>"+data2[i]+"</option>"); 
     } 
     } 
    }     
    }, 
    }); 
}); 


$('#fir').on("change", function() { 
    $('#sec').on("change", function() { 

      $('#tbl_S2').html("hello"); 

    }); 
}); 

Answer 1

Для того, чтобы конкретный пункт должен быть выбран, вы должны использовать метод option selected, то есть присоединять selected после data2 [я] , если есть только один элемент в списке. (добавить, если заявление)

Ваших если заявление будет выглядеть примерно так:

if (data2.length == 1){ 
    $("#sec").append("<option selected>"+data2[i]+"</option>"); 
    } 
else{ 
    for (var i = 0; i < data2.length; i++) { 
    $("#sec").append("<option>"+data2[i]+"</option>"); 
    } 
} 

Выходной HTML будет выглядеть как этот

<select> 
<option value="data" selected>Your variable</option> 
</select> 

Надеется, что это помогает

EDIT :

Приведенный ниже фрагмент представляет собой простой пример как показать оба значения из двух выпадающих меню, даже если в раскрывающемся списке имеется только один элемент. Обратите внимание, что в этом примере, если второй раскрывающийся список изменен (если вы отмените комментарий во втором варианте), выходной текст не изменится, пока не будет нажата другая выпадающая панель. Я уверен, что мог бы исправить это, потратив немного больше времени. Существует jsbin here

Я знаю, что ваш список не является статичным, но динамическим, что вы используете ajax для заполнения, однако я надеюсь, что это дает отправную точку.

var secSelect= ""; 
 

 
function showSelect(str) { 
 
    var schem1=""; 
 
    var returnText=""; 
 
    var schem1= str; 
 
    var sec1=document.getElementById("sec"); 
 
    var hello=document.getElementById("text1"); 
 
    var sec2=sec1.value; 
 
    
 
    if (secSelect !=""){ 
 
    sec1=secSelect; 
 
    } 
 
    
 
    hello.innerHTML = " hello"; 
 
    returnText= schem1 +" " +sec2 + hello.value; 
 
    document.getElementById("text1").innerHTML = returnText; 
 
}; 
 

 
function passSelect(str2){ 
 
    secSelect=str2; 
 
}

#text1{background-color:white!important; 
 
    width:150px; 
 
    display:inline-block; 
 
    height:13.5px; 
 
    vertical-align:top;} 
 
#sec, #fir{display:inline-block; 
 
    vertical-align:top; 
 
}

<select id="fir" onclick="showSelect(this.value);"> 
 
<option>one</option> 
 
<option>two</option> 
 
<option>three</option> 
 
</select> 
 

 
<select id="sec" onclick="passSelect(this.value);"> 
 
<option>one</option> 
 
<!--<option>rach</option>--> 
 
</select> 
 

 
<textarea id="text1" type="text"></textarea>