Javascript 选择带有文本框的框

我有以下代码：

HTML:

Javascript:

var allowMove = 0;
$('[id^=\"btnRight\"]').click(function (e) {
    var value = $('[name=count]').val();
    var chosen = $('#canselect_code :selected').length;
    if(chosen == value){
        alert('1');
        $(this).prev('select').find('option:selected').remove().appendTo('#isselect_code');
        allowMove = value;
    }
    else if(allowMove < value && allowMove < chosen){
        alert('2');
        $(this).prev('select').find('option:selected').remove().appendTo('#isselect_code');
        allowMove += 1;
    }
    else
        alert("Not Allowed!");
    });

$('[id^=\"btnLeft\"]').click(function (e) {
    allowMove = 0;
    $(this).next('select').find('option').remove().appendTo('#canselect_code');
});

我希望移动到右侧按钮只移动用户选择的元素数量，并且它应该与用户在文本框中输入的数量匹配。 “左”按钮将所有值移动到左选择框（无论是否选中）。 选择框允许选择多个值

那我该怎么做呢

编辑：

这是我设法创建的新javascript代码

如果用户一次选择一个值并单击“移动到右侧”按钮，则此操作正常

但是我注意到，如果用户在文本框中输入数字2，并从选择框中仅选择一个值，然后单击“移动到右侧”按钮，则效果良好。但在第二次中，如果用户选择多个值并单击“移动到右侧”按钮，则所有选定的值都将移到右侧。即使警报显示false，逻辑也无法验证else if语句

---

我在这里做错了什么？？？

这符合你的要求-参见

我不确定您对原始代码中的第一个else块的意图，但它与仅在项目数与计数输入匹配时移动所选项目的请求相矛盾，因此我省略了它

$('[id^=\"btnRight\"]').click(function (e) {
    var value = $('[name=count]').val();
    var chosen = $('#canselect_code :selected').length;
    if(chosen == value) {
        $('#canselect_code').find('option:selected').remove().appendTo('#isselect_code');
    } else {
        alert("Not Allowed!");
    }
});

$('[id^=\"btnLeft\"]').click(function (e) {
    $('#isselect_code').find('option').remove().appendTo('#canselect_code');
});

---

大家好，我有问题了。 在编辑中提到的场景中，它第二次运行第一个if语句，并将所选值附加到右侧的选择框中

下面是我创建的新javascript，它非常适合我的需要

var counter = 0;
$('[id^=\"btnRight\"]').click(function (e) {
    var value = $('[name=count]').val();
    var chosen = $('#canselect_code :selected').length;
    var tot = counter + chosen;
    var flag = true;
    if(tot > value)
        flag = false;
    alert(!(tot > value) + '\n' + tot);
    if(chosen == value && counter != value && flag) {
     counter = value;   $('#canselect_code').find('option:selected').remove().appendTo('#isselect_code');
    }
    else if(chosen < value && flag && counter < value){
     $('#canselect_code').find('option:selected').remove().appendTo('#isselect_code');
        counter+=chosen;
        alert(counter);
    }
    else {
        alert("Not Allowed!");
    }
});

$('[id^=\"btnLeft\"]').click(function (e) {
   counter = 0; $('#isselect_code').find('option').remove().appendTo('#canselect_code');
});

$('[id^=\"btnRight\"]').click(function (e) {
    var value = $('[name=count]').val();
    var chosen = $('#canselect_code :selected').length;
    if(chosen == value) {
        $('#canselect_code').find('option:selected').remove().appendTo('#isselect_code');
    } else {
        alert("Not Allowed!");
    }
});

$('[id^=\"btnLeft\"]').click(function (e) {
    $('#isselect_code').find('option').remove().appendTo('#canselect_code');
});

var counter = 0;
$('[id^=\"btnRight\"]').click(function (e) {
    var value = $('[name=count]').val();
    var chosen = $('#canselect_code :selected').length;
    var tot = counter + chosen;
    var flag = true;
    if(tot > value)
        flag = false;
    alert(!(tot > value) + '\n' + tot);
    if(chosen == value && counter != value && flag) {
     counter = value;   $('#canselect_code').find('option:selected').remove().appendTo('#isselect_code');
    }
    else if(chosen < value && flag && counter < value){
     $('#canselect_code').find('option:selected').remove().appendTo('#isselect_code');
        counter+=chosen;
        alert(counter);
    }
    else {
        alert("Not Allowed!");
    }
});

$('[id^=\"btnLeft\"]').click(function (e) {
   counter = 0; $('#isselect_code').find('option').remove().appendTo('#canselect_code');
});