jQuery-编程语言-文章分类

jQuery中live()变更

开始的时候在jQuery.1.7.1中使用了.live()觉得很好用，特别是在绑定事件之后再加入的元素的事件绑定上很方便(第一次live之后以后添加的元素就不需要绑定啦)

后来jQuery更新到1.9.1，页面中的.live报错:"has no method live", 后来查了文档才知道在新版本中做了修改。

//jQuery.1.8.3：
$("#liveID").live("click",function(){alert("live click");});

//jQuery.1.9.1：
$(document).on("click","#liveID",function(){alert("live click");});

jQuery网站上这么说的：

As of jQuery 1.7, the .live() method is deprecated. Use .on() to attach event handlers. Users of older versions of jQuery should use .delegate() in preference to .live().

jQuery原理(原型)

(function(){ 
  var jQuery = window.jQuery = window.$ = function( selector, context ) {
     return new jQuery.fn.init( selector, context);
  };
  jQuery.fn = jQuery.prototype = {
        init:function(selector, context){
           alert(selector);
        },
      add : function() {
          return this;
        }
   }
   jQuery.fn.init.prototype = jQuery.fn; 
})();   

//$("dd").add();

jQuery获取浏览器中的分辨率

$ (document).ready(function(){
    //浏览器当前窗口可视区域高度
 alert($ (window).height());
 //浏览器当前窗口文档的高度
  alert($ (document).height());
   //浏览器当前窗口文档body的高度
  alert($ (document.body).height());
  //浏览器当前窗口文档body的总高度 包括border padding margin
 alert($ (document.body).outerHeight(true));
 //浏览器当前窗口可视区域宽度
 alert($ (window).width());
  //浏览器当前窗口文档对象宽度
 alert($ (document).width());
    //浏览器当前窗口文档body的高度
  alert($ (document.body).width());
   //浏览器当前窗口文档body的总宽度 包括border padding margin
 alert($ (document.body).outerWidth(true));
  
    //显示器分辨率，只能用JavaScript代码获取
  alert(screen.height);
   alert(screen.width);
})

Uncaught ReferenceError: xl_chrome_menu is not defined

最近chrome "审查元素" 的时候下面总提示错误：

"Uncaught ReferenceError: xl_chrome_menu is not defined"

查了下，是安装的迅雷下载插件的问题，卸载了后就没有提示这个错误了

之前有些提出过卸载插件，是可以去掉，但是使用这个插件的情况下怎么避免错误消息呢？

看下了，发现只是变量未定义，试了下，可以自己修正，下面发一个手动解决方法如下：

一、打开插件的目录，（我的是 Thunder Download Extension for Chrome 1.7 ,Windows 7 x64旗舰版系统）（图1）

jQuery下拉菜单

今天闲来无事，凑空写两个基于jQuery库的滑动下拉菜单，不同于上次的点击下拉！美工实在不行，凑合用吧，！

jQuery打开/隐藏下拉菜单

jQuery部分：

$(document).ready(function () {
    $('img.menu_class').click(function () {
    $('ul.the_menu').slideToggle('medium');
    });
});

一个简单实用的弹出层组件

显示的效果如下图所示：

跨站脚本攻击漏洞 -Ver 2.1.1 Release (2.1.1.3626.3)

上传图片显示

<input type="file" name="file1" id="file1" size="40" onchange="changeSrc(this)"/>
<img src="about:blank" id="fileChecker" alt="test"  height="18"/>
<script type="text/javascript">
  var oFileChecker = document.getElementById("fileChecker");
  function changeSrc(filePicker)
  {
    oFileChecker.src = filePicker.value;//读图片
  }
</script>

javaScript document

对象属性

document.title //设置文档标题等价于HTML的title标签
document.bgColor //设置页面背景色
document.fgColor //设置前景色(文本颜色)
document.linkColor //未点击过的链接颜色
document.alinkColor //激活链接(焦点在此链接上)的颜色
document.vlinkColor //已点击过的链接颜色
document.URL //设置URL属性从而在同一窗口打开另一网页
document.fileCreatedDate //文件建立日期，只读属性
document.fileModifiedDate //文件修改日期，只读属性
document.fileSize //文件大小，只读属性
document.cookie //设置和读出cookie
document.charset //设置字符集 简体中文:gb2312

———————————————————————
常用对象方法

document.write() //动态向页面写入内容
document.createElement(Tag) //创建一个html标签对象
document.getElementById(ID) //获得指定ID值的对象
document.getElementsByName(Name) //获得指定Name值的对象
document.body.appendChild(oTag)

———————————————————————
body-主体子对象

jquery替换HTML页面中的值

<script type="text/javascript">
//检索A标记，符合的条件的改自己的值
$().ready(function(){
    $('a').each(function(){
        if($(this).text()=='Yxly330'){
            $(this).text('快乐飞扬论坛');
        }
    })
}) 
//替换唯一标签的值
document.title = "快乐飞扬论坛";
</script>

jquery给博客增加“页面加载中”特效!

第一步：加载jquery.min.js

  <script type="text/javascript" src="http://code.jquery.com/jquery-1.5.min.js"></script>

第二步：在</head>前添加一段JS代码

  <script type="text/javascript">
    $(function(){
      $('#loading-one').empty().append('页面加载完毕.').parent().fadeOut('slow');
    });
  </script>

第三步：在<body>后添加显示效果样式

  <div id="loading" onclick="javascript:turnoff('loading')">
    <p id="loading-one" onclick="javascript:turnoff('loading')">页面载入中,请稍后...</p>
  </div>

Flash里面的POST和GET

加载外部文本数据时候用到的loadVariablesNum(url,level,method) , loadVariables(url,target,method).
GET方式:

loadVariables("login.php?username=sam&password=123",_root,"GET");

POST方式:
method:String [可选> ─ 指定用于发送变量的 HTTP 方法。该参数必须是字符串 GET 或 POST。如果没有发送变量，则省略此参数。GET 方法将变量附加到 URL 的末尾，它用于发送少量的变量。POST 方法在单独的 HTTP 标头中发送变量，它用于发送长字符串的变量。
用于加载文本的还有loadVars类的sendAndLoad()方法:
GET:

var lv = new LoadVars();
lv.sendAndLoad("login.php?username=sam&password=123", lv, "GET");
lv.onLoad = function(success) {
    if (success){
        //do somethings
    }
};

bo-blog 2.1.1 鼠标悬停提示超链接特效

一、进入后台－模块配置，新建一个<head>模块，并输入以下代码：

<link rel="stylesheet" rev="stylesheet" href="plugin/LinkEffects/sweetTitles.css" type="text/css" media="all" />
<script type="text/javascript" src="plugin/LinkEffects/nicetitle.js"></script>

二、把以下两个代码保存为红色文件名传到此目录 plugin/LinkEffects/ 不存在请创建。
sweetTitles.css