使用jQuery在表单提交上设置选择值

时间:2016-02-02 10:59:53

标签: jquery html-select

我试图在提交时设置选择值,但我在声明函数和代码格式方面遇到了一些问题。希望你们能帮帮忙!

<form>
   <select>
      <option value="1" data-parent="-1">Alt 1</option>
      <option value="11" data-parent="1">&nbsp;&nbsp;Alt 1.1</option>
      <option value="12" data-parent="1">&nbsp;&nbsp;Alt 1.2/option>
      <option value="2" data-parent="-1">Alt 2</option>
      <option value="21" data-parent="2">&nbsp;&nbsp;Alt 2.1</option>
      <option value="22" data-parent="2">&nbsp;&nbsp;Alt 2.2</option>
      <option value="23" data-parent="2">&nbsp;&nbsp;Alt 2.3</option>
      <option value="24" data-parent="2">&nbsp;&nbsp;Alt 2.4option>
      <option value="3" data-parent="-1">Alt 3</option>
      <option value="31" data-parent="3">&nbsp;&nbsp;Alt 3.1</option>
      <option value="32" data-parent="3">&nbsp;&nbsp;Alt 3.2</option>
   </select>
   <input type="submit" value="Submit">
</form>

$('form select').on('change', function(e) {
  var optionSelected = $('option:selected', this);
  var selectedOptionParent = $('option:selected', this).attr('data-parent');

  var selectedValue = optionSelected.val();
  var parentValue = $('option[value="' + selectedOptionParent + '"]', this).val();

  var selectedValues = parentValue + ',' + selectedValue;
  console.log('Registered value is ' + parentValue + ',' + selectedValue);
});

$('form input[type="submit"]').on('click', function(e) {
  $('.modal-add-gallery-image select').val(selectedValues);
});

请在https://jsfiddle.net/iamchriswick/sa6v7f6h/3/

找到示例小提琴

1 个答案:

答案 0 :(得分:2)

Demo如果要让变量处理程序可以在另一个函数中访问,则需要在变更处理程序之外声明变量selectedValues

var selectedValues;
$('form select').on('change', function(e) {
    var optionSelected = $('option:selected', this);
    var selectedOptionParent = $('option:selected', this).attr('data-parent');

    var selectedValue = optionSelected.val();
    var parentValue = $('option[value="' + selectedOptionParent + '"]', this).val();

 selectedValues = parentValue + ',' + selectedValue; //setting its value
 console.log('Registered value is ' + parentValue + ',' + selectedValue);
});

$('form').on('submit', function(e) {
  console.log(selectedValues); //reading the value we set on change
  e.preventDefault();
});
相关问题