использовать js, чтобы сделать html button update select tag onchange function

Изучая программирование и JS с нуля. После того, как вы дошли до сих пор, чувствуйте себя неловко, что я не могу понять эту следующую часть. Выполнение кода как есть, просто покажет вам, какова моя основная цель. Просто отображение переупорядоченных данных. Но я пытаюсь добавить NEXT и ПРЕДЫДУЩИЕ кнопки, чтобы перейти к следующему варианту в меню выбора кавычек, чтобы уменьшить мили на мыши. У меня еще нет кода/функции для кнопки PREVIOUS, так как я пытаюсь найти успех с кодировкой кнопки NEXT. Вы можете использовать мои комментарии в коде, чтобы вести вас дальше. И я не использую jquery. Помните, что номера (номера магазинов) не являются совершенно последовательными. Следовательно, «+ 1» на самом деле не очень хорошая идея. Как бы я код Кнопки для циклического переключения между опциями Select tag и обратно? Благодаряиспользовать js, чтобы сделать html button update select tag onchange function

<body> 

<p id="display1"><p/> <!--Used for debugging--> 
<button type="button" onclick="previousButton()">Previous Store</button><!--Unused for now--> 
<button type="button" onclick="nextButton()">Next Store</button> 
<p>STORE NUMBER: <select id="mySelect" onchange="storeRequest()"> 
    <option value="00">00 
    <option value="01">01 
    <option value="02">02 
    <option value="03">03 
    <option value="04">04 
    <option value="05">05 
    <option value="06">06 
    <option value="08">08 
    <option value="56">56 
</select> 

</p> 

<ol id="showpages"></ol> 

</body> 


<script type="text/javascript"> 



//function below is object constructor for Page objects. 
function page(name, storeNumS) { 
    this.name = name; 
    this.storeNumS = storeNumS; 
    this.storesArray = storeNumS.split(" ") 
} 


// Below are some test instances of the page objects 
// JS-program's goal is to rearrange the data, then display it 
var _001_01 = new page("_001_01", "01 03 05 56 06 08"); 
var _001_02 = new page("_001_02", "01 02 03 04 05 08"); 
var _002_01 = new page("_002_01", "02 03 04 56 06 08"); 
var _002_02 = new page("_002_02", "02 03 04 56 06 08"); 

// All the above pages in an array 
var allPagesArray = [_001_01, _001_02, _002_01, _002_02]; 

// This function gets the <select> option, then runs the search function 
var storeRequest = function() { 
    var request = document.getElementById("mySelect").value; 
    searchObjAry(request); 
} 


// Below is the function I'd like help in. 
// Havent created a funciton for "Previous Button" since am 
// trying to figure out "Next" Button currently. 
// Hence "previousButton()" doesn't exist yet 

var nextButton = function(nextRqst) { 
    var request = document.getElementById("mySelect").value; 
    var nextRqst = request + 1; // or rather goto next option on select tag list 
    searchObjAry(nextRqst); 
    // Used the line below to test the function 
    // document.getElementById("display1").innerHTML = nextRqst; 
} 


// The function below will search for requested store in every page, 
// then create a list and update the DOM 
var searchObjAry = function (storeNum){ 
    var orderedPgList = ""; 
    var pageList = []; 
    for (i = 0; i < allPagesArray.length; i++){ 

     for (j = 0; j < allPagesArray[i].storesArray.length; j++){ 
      if (allPagesArray[i].storesArray[j] === storeNum){ 
       pageList.push(allPagesArray[i].name); 

      } 
     }  
    } 
    for (k = 0; k < pageList.length; k++) { 
     orderedPgList += "<li>" + pageList[k] + "</li>"; 
    } 
    document.getElementById("showpages").innerHTML = orderedPgList; 

    return; // <-- still have no idea what "return" really does. Not sure if it'll mess anything up later. 
} 
</script>

UPDATE: 5 апреля 2016 года Благодаря user2314727, я смог узнать, что «выбрать» может действовать как массив и на это «варианты» действовать в качестве индексированных элементов. и возиться с моим кодом снова прошлой ночью с помощью Google, я пришел с решением ниже. добавив ключевое слово «.value» к вкладу @user ..., я смог обработать значение параметра в функции searchObjAry().
Только проблема, которую нужно исправить, состоит в том, чтобы сделать цикл PreviousButton обратно в нижнюю часть списка и вернуться назад одинаково так же, как NextButton работает вперед.

var nextButton = function() { 
    var request = document.getElementById("mySelect"); 
    var nxtIndx = request.options[request.selectedIndex += 1].value; 
    searchObjAry(nxtIndx); 
} 

var previousButton = function() { 
    var request = document.getElementById("mySelect"); 
    var prevIndx = request.options[request.selectedIndex -= 1].value; 
    if (prevIndx !== request[0]){ 
     searchObjAry(prevIndx); 
    }else if (prevIndx === request[0]){ 
     prevIndx = request.options[request.selectedIndex = 8].value; 
     searchObjAry(prevIndx); 
    } 

}

источник

2016-03-30 theUnlearned

Может быть, это поможет (выбрать следующий тег в списке, нажав на nextButton):

var request = document.getElementById("mySelect"); 
request.selectedIndex += 1; // goto next option on select tag list

//function below is object constructor for Page objects. 
 
function page(name, storeNumS) { 
 
    this.name = name; 
 
    this.storeNumS = storeNumS; 
 
    this.storesArray = storeNumS.split(" ") 
 
} 
 

 

 
// Below are some test instances of the page objects 
 
// JS-program's goal is to rearrange the data, then display it 
 
var _001_01 = new page("_001_01", "01 03 05 56 06 08"); 
 
var _001_02 = new page("_001_02", "01 02 03 04 05 08"); 
 
var _002_01 = new page("_002_01", "02 03 04 56 06 08"); 
 
var _002_02 = new page("_002_02", "02 03 04 56 06 08"); 
 

 
// All the above pages in an array 
 
var allPagesArray = [_001_01, _001_02, _002_01, _002_02]; 
 

 
// This function gets the <select> option, then runs the search function 
 
var storeRequest = function() { 
 
    var request = document.getElementById("mySelect").value; 
 
    searchObjAry(request); 
 
} 
 

 

 
// Below is the function I'd like help in. 
 
// Havent created a funciton for "Previous Button" since am 
 
// trying to figure out "Next" Button currently. 
 
// Hence "previousButton()" doesn't exist yet 
 

 
var nextButton = function(nextRqst) { 
 
    var request = document.getElementById("mySelect"); 
 
    request.selectedIndex += 1; // goto next option on select tag list 
 

 
    searchObjAry(nextRqst); 
 
    // Used the line below to test the function 
 
    // document.getElementById("display1").innerHTML = nextRqst; 
 
} 
 

 

 
// The function below will search for requested store in every page, 
 
// then create a list and update the DOM 
 
var searchObjAry = function(storeNum) { 
 
    var orderedPgList = ""; 
 
    var pageList = []; 
 
    for (i = 0; i < allPagesArray.length; i++) { 
 

 
    for (j = 0; j < allPagesArray[i].storesArray.length; j++) { 
 
     if (allPagesArray[i].storesArray[j] === storeNum) { 
 
     pageList.push(allPagesArray[i].name); 
 

 
     } 
 
    } 
 
    } 
 
    for (k = 0; k < pageList.length; k++) { 
 
    orderedPgList += "<li>" + pageList[k] + "</li>"; 
 
    } 
 
    document.getElementById("showpages").innerHTML = orderedPgList; 
 

 
    return; // <-- still have no idea what "return" really does. Not sure if it'll mess anything up later. 
 
}

<p id="display1"> 
 
    <p/> 
 
    <!--Used for debugging--> 
 
    <button type="button" onclick="previousButton()">Previous Store</button> 
 
    <!--Unused for now--> 
 
    <button type="button" onclick="nextButton()">Next Store</button> 
 
    <p>STORE NUMBER: 
 
    <select id="mySelect" onchange="storeRequest()"> 
 
     <option value="00">00 
 
     <option value="01">01 
 
     <option value="02">02 
 
     <option value="03">03 
 
     <option value="04">04 
 
     <option value="05">05 
 
     <option value="06">06 
 
     <option value="08">08 
 
     <option value="56">56 
 
    </select> 
 

 
    </p> 
 

 
    <ol id="showpages"></ol>

источник

2016-03-30 21:58:41 user2314737

Спасибо. Прогрессивный, хотя и неполный. Ваш код для функции кнопки работает, позволяя циклически перемещаться по параметрам список. Странно, так как функция func вызывает searchObjAry func с новым аргументом, не работает: var nextButton = function() { var request = document.getElementById ("mySelect"); searchObjAry (request.selectedIndex + = 1); } – theUnlearned

Я использовал ваш взнос и у меня было больше времени на google прошлой ночью, и узнал, что вы ссылаетесь на

использовать js, чтобы сделать html button update select tag onchange function

ответ