Jquery学习笔记

一.JS笔记

1.Jquery表单验证：

jquery将$(“.errer”)的div块设置为$('.error').hide();

然后在需要显示的地方设置属性为 .show（）；

获取某个对象的值：$(“.value”).val().

2.js查看某个值的属性：alert(typeof(val));

3.js输出代码：alert();

4.在html中调用JS代码

 <button onclick="javascript:chose_register()" class="btn btn-primary col-md-3">注册</button>

5.在PHP里调用JS代码： echo "<script type=‘text/javascript’>document.write(str)</script>";  

6..使用JS获取html里?**&**传递的参数（转载）：

function GetQueryString(name){     var reg = new RegExp("(^|&)"+ name +"=([^&]*)(&|$)");//实现中文转码     var url=decodeURI(window.location.search);     var r = url.substr(1).match(reg);     if(r!=null)return  unescape(r[2]); return null;}

7.Jquery可实现播放动画的功能。操作Bootstrap的字体图标（需要在项目里加入字体文件）能够实现快捷的小功能。

二.采用clipboard类实现复制文本框内容

包含文件

<scriptsrc="/clipboard.min.js"></script>

1.获取全局的字符串：

copytext=“复制的文字”;//当不使用var时，即为全局变量。$(".message").append('<div class="row" style="padding-top:10px;"><button type="button" class="copy_new_link btn btn-info col-md-1" onclick="copy_new_link()">复制链接</button></div>');var clipboard = new Clipboard('.copy_new_link',{text:function(){return copytext;}});//实现点击延时动画的功能clipboard.on('success', function(e) { e.trigger.innerText = "已复制";        setTimeout(function(){        e.trigger.innerText = "复制链接";    }, 1000);});clipboard.on('error', function(e) {alert("复制失败，请选择手动或者切换浏览器！");     });

2.获取绑定在控件上的值：

<Button type='button'  class='copy_item btn btn-info ' data-clipboard-text='"+root+"/"+data[i][0]+"' onclick='copyitem()'>复制推广链接</button> ";function copyitem(){var btn = document.querySelectorAll('.copy_item');var clipboard = new Clipboard(btn);clipboard.on('success', function(e) { e.trigger.innerText = "已复制";        setTimeout(function(){        e.trigger.innerText = "复制推广链接";    }, 1000);});clipboard.on('error', function(e) {alert("复制失败，请选择手动或者切换浏览器！");     });}

三.实现根据输入框查询，筛选不同的行显示

 

<div style="text-align:centor;margin-left: 60%; margin-bottom: 20px;"> Search:<input type="text" id="chose_row"/></div>$('#chose_row').keyup(function(){        $('table tbody tr').hide().filter(":contains('" +($(this).val()) + "')").show();      }).keyup();

四.JQuery使用hover()事件实现鼠标进入和离开功能

hover的第一个参数（匿名方法）表示mouseenter，第二个参数表示mouseleave，即表示可以为hover传递两个参数。直接在元素上注册这两个函数来控制。

$(function(){$(".show_list").hide();$( "li" ).hover(function(){$(this).find(".show_list").show();},function(){$(this).find(".show_list").hide();});});