此教程只适用于新手
- 点击新建项目
- 点击Visual C# 打开列表后选择第二个 Web
- 点击确定
- 选择第三个MVC
- 将云中托管取消(正版用户可忽略这一步),然后点击确定
- 进入界面后,在最右侧点击方案资源管理器,展开后选择Controllers 鼠标右键展开 添加控制器
7、点击添加视图,会弹出一个添加基架的窗口 选择到MVC5控制器-空 后点确定
8、填写控制器名,一般采用驼峰命名法
9、点击添加完后 进入这个页面 默认网页名称为Index
10、然后右键点击Index 转到视图
11、来到页面后添加JQuery插件
12、在最右侧Content文件夹右键点击在文件管理器中打开文件夹
13、将JQuery插件加入文件夹
14、添加完后点击显示所有文件 如果显示出几个透明的文件夹 即为成功
15、按住CTRL键,选中三个文件 然后左键 展开列表包括在项目中如果文件夹不再是透明的就成功了
16、添加完成后,选中到JQuery插件 将它拉入视图中
或者是从CDN 中载入 jQuery,(需要网络) 例如
百度 CDN
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></s
cript>
18、写出Htm5源码 将网页布局好
(仅作为参考)
<body>
<div class="sa">
<select multiple="multiple" id="select1">
<option value="">Joker</option>
<option value="">ZIO</option>
<option value="">Build </option>
<option value="">DIo</option>
</select>
<input type="button" value="<全部向左" id="b4">
<input type="button" value="<单个向左" id="b3">
<input type="button" value="单个向右>" id="b1">
<input type="button" value="全部向右>" id="b2">
<select multiple="multiple" id="select2">
<option value="游戏">BK</option>
</select>
<div id="b">
<h1 style="color:red">实验<span style="color:blue">开始</span></h1>
</div> <button id="a" style="margin-left:166px;">W</button>
</div>
此处为语法分析
<select multiple="multiple" >:允许在下拉列表中进行多选:
<option> 元素定义下拉列表中的一个选项(一个条目)。
<input type="button" value="">标签用于搜集用户信息,可以修改里面的属性做出不同的样式,在这里是作为按钮 可用普通的button代替
<script>:脚本命令
注意jQuery的选择器与htm5的有极大的不同
一定要加上$,然后再(“内容”)
* 选取所有元素 #id 根据给定的 ID 匹配一个元素
.class 根据给定的类匹配元素
element 根据给定的元素名匹配所有元素
18、将两个框架既<select multiple="multiple" >与四个按钮绑定id
19、绑定ID后 在尾部新建
<script>标签
再利用JQuery调用函数
$("#b1").on("click", function () {
$(":selected").appendTo("#select2")
})
语法解析 $:JQuery选择器 .on触发 click点击事件
function 方法 :selected被选中的option元素
appendTo 在结尾插元素入内容
select2:第二个框的名字 和起来就是
用JQuery选择器 选中到名为(“#b1”)的按钮并赋予点击事件,点击后运行方法
选中被选择到的列表插入到select2的框里面
成 功
20、只要完成这一步就基本可以做完了 因为功能是一样的 所以只用改一点点就可以完成了
$("#b2").on("click", function () {
$("option ").appendTo("#select2")
})
将 selected替换成option 即可完成
实现向左向右只需改变框ID即可
这是我所学到的jQuery教程,虽然写的非常烂,但希望可以帮助到你们。
以上就是我的分享,新手上道,请多多指教。如果有更好的方法或不懂得地方欢迎在评论区教导和提问喔!