Tim Medora..
96
此示例将从左到右移动项目(一个或多个),然后再移回.无论在右侧选择了哪个项目,都将更新右侧的文本框.
我们正在使用这些元素:
select
input type=”button”
input type=”text”
陷害者:
div
section
采用简单的CSS设计.功能由JavaScript提供.
我正在使用jQuery库让事情变得更容易一些.这也可以使用纯JavaScript完成.
$(“#btnLeft”).click(function () {
var selectedItem = $(“#rightValues option:selected”);
$(“#leftValues”).append(selectedItem);
});
$(“#btnRight”).click(function () {
var selectedItem = $(“#leftValues option:selected”);
$(“#rightValues”).append(selectedItem);
});
$(“#rightValues”).change(function () {
var selectedItem = $(“#rightValues option:selected”);
$(“#txtRight”).val(selectedItem.text());
});
SELECT, INPUT[type=”text”] {
width: 160px;
box-sizing: border-box;
}
SECTION {
padding: 8px;
background-color: #f0f0f0;
overflow: auto;
}
SECTION > DIV {
float: left;
padding: 4px;
}
SECTION > DIV + DIV {
width: 40px;
text-align: center;
}
1
2
3
棒极了.非常感谢您的时间和帮助. (3认同)
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/200525.html原文链接：https://javaforall.net
