Установка значения выбора HTML с помощью JavaScript

index.php

<script type="text/javascript">
function setActionStar(btnValue) {
 var actionstar = document.getElementById('actionstars');

 alert(btnValue);
 alert(actionstar.value);

 actionstar.value = btnValue;
 return false;
}
</script>

<form> 
 <?php
  $actionstars = array("Jean Claude Van Damme", "Scott Adkins", "Dolph Lundgren", "Michael Jai White");

  $ctr = 1;
 ?>

 <select id="actionstars" name="actionstars">
  <?php
   foreach($actionstars as $as){
    echo "<option value=" . $ctr . " >" . $as . "</option>";
    $ctr++;
   }
  ?>
 </select>

 <br />

 <?php
  for($i=1; $i<= count($actionstars); $i++) {
 ?>
 <input type="submit" value="<?php echo $i; ?>" onclick="setActionStar(this.value);" />
 <?php
  }
 ?>
</form>

Я занимаюсь этой дилеммой уже почти 2 часа. Я не знаю, что в этом плохого. Что я пытаюсь сделать, так это всякий раз, когда пользователь нажимает кнопку, он меняет значение выпадающего списка на значение кнопки. Например, если я нажму кнопку 1, поле со списком будет иметь значение 1. Он работает с другими элементами HTML, но я не знаю, почему он здесь неприменим.

Я очень новичок в программировании, так что не будьте ко мне суровы. Пожалуйста, не надо думаю, я не приложил к этому никаких усилий. Просто я честно не знаю, что я делаю. Пожалуйста, помогите.

Author: Smi, 2011-06-29
Source

4 answers

Вам нужно перебрать параметры, чтобы найти тот, значение которого вы хотите, затем установите для выбранного свойства значение true (и установите для выбранного свойства любого другого выбранного параметра значение false). Или вы можете установить для свойства SelectedIndex элемента select значение индекса соответствующего параметра.

Редактировать - простой пример 

<form>
  <select id="sel0" name="foo">
    <option selected>default
    <option value="a">a
    <option value="b">b
    <option value="c">c
  </select>
  <input type="button" onclick="setSelect('sel0','a')" value="Set to a">
  <input type="button" onclick="setSelect('sel0','b')" value="Set to b">
  <input type="button" onclick="setSelect('sel0','c')" value="Set to c">
  <br>
  <input type="reset">
</form>

<script type="text/javascript">
  function setSelect(id, value) {
    var sel = document.getElementById(id);
    var option, options = sel.options;
    var i = options.length;
    while (i--) {
      option = options[i];
      option.selected = (option.value == value)? true : false;
    }
  }
</script>

Существуют более эффективные и общие способы сделать это, выше показан базовый подход.

 2
Author: RobG, 2011-06-29 05:49:24

Используйте свойство selectedIndex элемента select, чтобы задать выбранный индекс: 

actionstars.selectedIndex = 0;

Только вместо того, чтобы устанавливать его равным 0, вам нужно выяснить, какое правильное значение из вашего btnValue.

Смотрите также здесь: http://www.w3schools.com/jsref/prop_select_selectedindex.asp

 3
Author: bbg, 2011-06-29 05:41:53

Вы не можете установить значение выбора таким образом.. вам нужно будет добавить "выбранный" в тег "опция", который должен быть выбран..

РЕДАКТИРОВАТЬ я вижу, что вы запросили код.. вот он..:)

Javascript

actionstar.value = function() {
    [].forEach.call(document.querySelectorAll('#actionstars option'), function(col) {
        if(col.value==btnValue) col.selected = true;
        else col.selected = false;
    });    
}

Кстати, я думаю, что вам нужно type="button" вместо type="submit"

 2
Author: Achshar, 2011-06-29 05:52:57

Вы можете видеть это как выбранный вами элемент. Есть несколько вариантов, и у них есть значения. Поэтому, если вы собираетесь установить значение элемента Select, это не сработает. Вам нужно установить значение элемента options.

 -1
Author: sushil bharwani, 2011-06-29 05:38:08