按选项值订购商品

Question

我已经得到了下面的代码，代码没问题，唯一的问题是，如果我按顺序做了错误的事情，我想纠正它，整个文本被清除并开始从开始：

function getValues() { 
var result = []; 
var me = this; 
$('select').each(function (idx, el) { 
    var $el = $(el); 
    result[3*$el.val()+idx]=($el.next('input[type="hidden"]').val() + ' ' + $el.val()); 
    if (me === el) return false; 
}); 
console.log(result); 
$('#res').html(result.join(' ')); 
} 

$('select.startID,input[type="hidden"]').change(getValues); 


<select name="startID[]" class="startID"> 
<option value="0">SELECT</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<input type="hidden" name="startText[]" value="Text1"> 
Text1 
<br /> 

<select name="startID[]" class="startID"> 
<option value="0">SELECT</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<input type="hidden" name="startText[]" value="Text2"> 
Text2 

<br /> 

<select name="startID[]" class="startID"> 
<option value="0">SELECT</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<input type="hidden" name="startText[]" value="Text3"> 
Text3 
<div id="res"></div> 

DEMO：http://jsfiddle.net/aburayane/zwzx7ann/

所以在选择框前面的文本是在隐藏的输入一样，我应该从选择框，对应于文字前面相同的值，例如1 => Text1,2 => Text2,3 => Text3，如果错误地选择了1 => Text2,2 => Text1和3 => Text3，所以我的错误出现在Text1和Text2中，我没有选择正确的值，如果我想纠正，整个文本被删除并从头开始。

我的问题：有没有什么方法可以在不删除数据的情况下对打印的文本进行更正，它应该交换在一起。

在此先感谢

Answer 1

有什么奇怪在这里，因为你已经mentionned你getValues功能打破曾经在each回路电流select元素是一个主题有能力改变：

if (me === eq) return false; 

所以一旦你为所有三个select元素选择了一些值，例如你回到第一个元素，迭代将改变第一个元素，并检查它是否是一个可能发生改变的事件和return false这将会绝对地阻止后续迭代，因此以下select元素选择将不会显示，即使他们已经选择过。

你需要的是一个简单的function的是，不要只检查，如果目前的select是被改变的人，而且要检查下一个项目已经存在于结果字符串。这可以通过检查，如果后者的值已经在RES HTML字符串简单地完成，条件，那么可能会像这样：

if ((me === el) && !nextItemWasAlreadyShown(idx + 1)) 
    return false; //Check if next element (idx + 1) of the current select was already in the res string 

凡nextItemWasAlreadyShown函数声明如下所示：

function nextItemWasAlreadyShown(index) { 
    var continueLoop = false; 
    var resText = $('#res').html(); 
    var text = $('select').eq(index).next('input[type="hidden"]').val(); 
    if (resText.indexOf(text) > -1) 
    continueLoop = true; 
    return continueLoop; 
} 

完整演示可以在JSFiddle的修改版本中找到。