我试图在提交时设置选择值,但我在声明函数和代码格式方面遇到了一些问题。希望你们能帮帮忙!
<form>
<select>
<option value="1" data-parent="-1">Alt 1</option>
<option value="11" data-parent="1"> Alt 1.1</option>
<option value="12" data-parent="1"> Alt 1.2/option>
<option value="2" data-parent="-1">Alt 2</option>
<option value="21" data-parent="2"> Alt 2.1</option>
<option value="22" data-parent="2"> Alt 2.2</option>
<option value="23" data-parent="2"> Alt 2.3</option>
<option value="24" data-parent="2"> Alt 2.4option>
<option value="3" data-parent="-1">Alt 3</option>
<option value="31" data-parent="3"> Alt 3.1</option>
<option value="32" data-parent="3"> 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);
});
找到示例小提琴
答案 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();
});