Блог

Я новичок в программировании. У меня вопрос из двух частей:

1. Допустим, у меня есть:

 #html    
<style>
    <option value="1"> Red Box </option>
    <option value="2"> Green Box </option>
    <option value="3"> Blue Box </option>
</style>
<style>
    <option value="4"> Red Circle</option>
    <option value="5"> Green Circle</option>
    <option value="6"> Blue Circle</option>
</style>
  

Каков наилучший способ присвоить каждой опции значение в долларах, чтобы значение можно было вычислить в jQuery?

2. Как можно использовать jQuery для создания этих результатов: * Цены выбранных опций суммируются и отображаются пользователю * Пользователь может выбрать «отправить параметры»

Цены выбранных опций суммируются и показываются пользователю

Просто, просто сделайте:

   var total = 0;
  $('select').each(function() {
      // Convert val from string to integer, so it isn't cocantenated.
      total  = parseInt($(this).val());
  });
 alert('Total is: '   total);
  

Пользователь может выбрать «отправить параметры»

Ну, обычно вам нужна кнопка отправки:

 <input type="submit" value="Submit" name="submit"/>
  

Затем вы можете либо позволить браузеру обрабатывать отправку значений формы. Для этого каждый select или любой элемент формы должен быть дочерним по отношению к форме. Вы также определяете, куда форма должна отправлять / получать значения

 <form name="shapes" action="/form-handler.php" method="post">
  <!-- your select elements here !-->
</form>
  

Каждый элемент в вашей форме ДОЛЖЕН иметь атрибут name, если вы хотите, чтобы он был представлен правильно.

Если вы хотите, чтобы jQuery отправлял форму через ajax, вы можете использовать красоту serialize

  $('[name=shapes]').serialize();
  

Это преобразует значения формы в строку запроса для публикации. Смотрите http://api.jquery.com/serialize / для получения подробной информации об этой функции.

Лучший способ присвоить каждой опции значение в долларах — это использовать ключ value тега option. Это выглядело бы примерно так:

 #html    
<select> <!-- I'm assuming you meant a select-tag here not a style-tag -->
    <option value="5"> Red Box </option>
    <option value="8"> Green Box </option>
    <option value="1"> Blue Box </option>
</select>
<select>
    <option value="6"> Red Circle</option>
    <option value="3"> Green Circle</option>
    <option value="1"> Blue Circle</option>
</select>
  

Ваш код jQuery может выглядеть следующим образом:

 var total = $('select:first').attr('value')   $('select:last').attr('value');
  

Чтобы получить общее:

 <script>
  $(document).ready(function(){
    alert( $('select:first').val()   $('select:last').val() );
  });
</script>
  

Надеюсь, это поможет. Приветствия