首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在jquery中使用add/delete/close选项引导双列表框和带有获取值的单个select

问在jquery中使用add/delete/close选项引导双列表框和带有获取值的单个select
EN

Stack Overflow用户
提问于 2014-08-22 13:00:11
回答 1查看 9.5K关注 0票数 1

谁能帮我解决这个问题吗?

引导只有单/多个选择的双列表框选项。

我需要双列表箱与单一选择。

解释:

例如:

我有双列表框,左列表框有5个选项。我需要单项选择。(即)如果我在左列表框中选择了单个选项,它会显示弹出(警报)并获取相应的字段值,并且弹出窗口有 add 或Cancel按钮来添加/取消values.After,单击弹出窗口中的add选项,它将被添加到右列表框中。

如果我在右列表框中选择该选项,它将再次显示弹出(警报)并获取相应的字段值,并显示弹出窗口有删除或Cancel按钮,以删除/取消右侧列表框中的值。

请任何人给出这个问题的解决方案,

谢谢,

EN

回答 1

Stack Overflow用户

发布于 2014-08-22 13:37:09

代码语言:javascript
复制
//Html
<select id="sel1">
    <option value="1">1</option>
    <option value="2">2</option>
    <option value="3">3</option>
    <option value="4">4</option>
</select>
<select id="sel2"></select>
//This is the JS
//On change of the first select
$('#sel1').on('change', function (e) {
    e.preventDefault();
    var selVal = $(this).val();
    var selHtml = $(this).find('option:selected').text();
    moveItem('#sel1', '#sel2', selVal, selHtml);//call our function
});
//On change of the second select
$('#sel2').on('change', function (e) {
    e.preventDefault();
    var selVal = $(this).val();
    var selHtml = $(this).find('option:selected').text();
    moveItem('#sel2', '#sel1', selVal, selHtml);//call our function
});
//Move function take 4 parameters
function moveItem(moveFrom, moveTo, selVal, selHtml) {
    if (confirm("Are you sure? : " + selVal)) {//Confirm dialogue box comes up and on selecting 'ok' this part will be executed
        $(moveTo).append('<option value="' + selVal + '">' + selHtml + '</option>');//append a value to select
        var mId = moveFrom + ' option[value="' + selVal + '"]';
        $(mId).remove();//remove value from the other select
    }
    return false;
}
票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/25447664

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档