jquery 实现两Select 标签项互调示例代码
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.1.min.js"></script>
</head>
<SCRIPT LANGUAGE="JavaScript">
<!--
$(document).ready(function() {
$("#toRight").click(function(){
$("#selectLeft option:selected").each(function(){
$("#selectRight").append("<option value=" + $(this).val() + ">" + $(this).html() + "</option>");
$(this).remove();
});
});
$("#toLeft").click(function(){
$("#selectRight option:selected").each(function(){
$("#selectLeft").append("<option value=" + $(this).val() + ">" + $(this).html() + "</option>");//这个方法是默认在后面添加
//$("#selectLeft option:first").before("<option value=" + $(this).val() + ">" + $(this).html() + "</option>"); //此种方法是在select前面加内容
//$("#selectLeft option[value=3]").before("<option value=" + $(this).val() + ">" + $(this).html() + "</option>"); //此种方法是在selectt指定某一行加内容
$(this).remove();
});
});
});
//-->
</SCRIPT>
<BODY>
<table>
<tr>
<td>
<select size='10' multiple id="selectLeft" style="width:200px">
<option value="0">Jquery API</option>
<option value="1">JavaScript高级程序设计</option>
<option value="2">锋利的jQuery</option>
<option value="3">JavaScript 设计模式</option>
<option value="4">JavaScript+DOM高级程序设计</option>
<option value="5">PHP高级程序设计</option>
<option value="6">面向对象程序设计</option>
</select>
</td>
<td>
<input type="button" value=" >> " id="toRight" /><br /><br />
<input type="button" value=" << " id="toLeft" />
</td>
<td>
<select size='10' multiple id="selectRight" style="width:200px">
</select>
</td>
</tr>
</table>
</BODY>
</HTML>
-
本文向大家介绍vue实现添加标签demo示例代码，包括了vue实现添加标签demo示例代码的使用技巧和注意事项，需要的朋友参考一下 本篇文章主要介绍vue添加标签，废话不多说了，下面上具体代码 效果如下： html js 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持呐喊教程。
-
本文向大家介绍jQuery EasyUI Layout实现tabs标签的实例，包括了jQuery EasyUI Layout实现tabs标签的实例的使用技巧和注意事项，需要的朋友参考一下 jQuery EasyUI Layout实现tabs标签的实例 一、概述： 1、引入jquery.js与easyUi相关文件 2、效果如图： 二、创建Layout主页： 三、创建中间页面： 四、菜单页：west.
-
本文向大家介绍jQuery简单实现彩色云标签效果示例，包括了jQuery简单实现彩色云标签效果示例的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jQuery简单实现彩色云标签效果的方法。分享给大家供大家参考，具体如下： 一、JS Code： 二、Html Code： 更多关于jQuery相关内容感兴趣的读者可查看本站专题：《jQuery常用插件及用法总结》、《jQuery常见经典特效汇总
-
本文向大家介绍bootstrap提示标签、提示框实现代码，包括了bootstrap提示标签、提示框实现代码的使用技巧和注意事项，需要的朋友参考一下 首先聊一聊提示标签： 效果： 下面讲一讲提示框： 效果： 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持呐喊教程。
-
本文向大家介绍js实现网页的两个input标签内的数值加减(示例代码)，包括了js实现网页的两个input标签内的数值加减(示例代码)的使用技巧和注意事项，需要的朋友参考一下 实例如下所示： 下面是效果图 ↓ 以上这篇js实现网页的两个input标签内的数值加减(示例代码)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持呐喊教程。
-
本文向大家介绍jquery 为a标签绑定click事件示例代码，包括了jquery 为a标签绑定click事件示例代码的使用技巧和注意事项，需要的朋友参考一下