我有一堆带编号类的选择框。我有相同数量的带编号类的输入字段。每当用户添加一个选择框时,它会向上编号,并自动创建一个具有相同编号的新输入。因此,selectbox1
有input1
作为伴侣。
现在我需要将选择的值从选择框复制到输入。我部分地工作了,但此刻它正在复制到所有输入。
以下是代码:
(function ($) {
$(document).ready(function() {
$(".selectArea").each(function(i) {
$(this).addClass("selectBox" + (i+1));
});
var values = $("input[id^='jform_params__characters__characters'][id$='__character_name']").map( function(){return $(this).val(); }).get();
var optionsPlaceholder = '###OPTIONS###';
var optionPlaceholder = '###OPTION###';
var select = '<select class="selectInput">' + optionsPlaceholder + '</select>';
var option = '<option>' + optionPlaceholder + '</option>';
var options = '';
for (var i = 0; i < values.length; i++) {
var currentOption = option.replace(optionPlaceholder, values[i]);
options += currentOption;
}
var selectBox = select.replace(optionsPlaceholder, options);
var $select = $(selectBox);
$(".selectBox").html($select);
$(".selectInput").each(function(i) {
$(this).addClass("selectInput" + (i+1));
});
$("input[id^='jform_params__storymaker__storymaker'][id$='__characterselection_save']").each(function(i) {
$(this).addClass("selectInputSave selectInputSave" + (i+1));
});
});
$(document).on('change', '.selectInput', function() {
alert(this.value); // or $(this).val()
$('.selectInputSave').val($(this).val());
//$('.selectInputSave' + (i+1)).val($(this).val());
});
})(jQuery);
问题在于$(document).on('change'
功能。
正如你在我使用
$('.selectInputSave').val($(this).val());
然后它将它复制到所有正常的输入字段,所以我要做到这一点。
$('.selectInputSave' + (i+1)).val($(this).val());
但它表示i
未定义。这是真的,因为它并非如此,我尝试通过重用doc.ready
函数中的部分代码来定义它。只有当我这样做时,才会发生最奇怪的行为。第一个选择框值将被复制到最后一个输入???
如何实施此i+1
?这样selectInput1
就会被复制到selectInputSave1
等等。
它需要是动态的,因为用户可以创建无限的选择框。
非常感谢您的帮助!
答案 0 :(得分:0)
我从Mamdouh Freelancer那里得到了灵感。他的评论让我考虑从选择框中获取类号,并使用该数字添加到要保存它的类中。
所以我提取了这个类&gt;替换了文本部分,留下了一个数字。 然后我将这个数字添加到我想要保存到的输入中并且它可以工作。
选择1保存到输入1
选择2保存到输入2
选择3保存到输入3
Etc Etc。
这是代码。
allow_tags