‘ Jquery ’ 目录归档

IE8以下浏览器设置Title的问题

在项目中使用jQuery1.7.2作为基础框架，获取title对象和值都没有问题，但是如果需要重新设置title的值的时候在IE低版本浏览器(6、7、8)上就会出现错误，报错的代码块是：

append: function() {
		return this.domManip(arguments, true, function( elem ) {
			if ( this.nodeType === 1 ) {
				this.appendChild( elem );
			}
		});
	}

在IE低版本浏览器上，title不支持appendChild方法，就会抛出“意外的调用了方法或属性访问。”的错误，那么我们应该怎么解决这个问题呢？因为title在Html中属于比较特殊的元素，所以可以通过document.title来获取和设置，而且兼容性很好，所以我们可以这样做：

function setTitle(v){
            try{
                document.title = v;
            }catch (e){
                $('title').text(v);
            }
        }

JS+CSS浮动框架加载连接自适应宽高

很久以前发布在CSDN上的一个简单案例，今天看来非常粗糙，所以下载下来完善了一下，欢迎吐槽！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta content="text/html; charset=gb2312" http-equiv="Content-Type" />
    <meta content="IE=EmulateIE7" http-equiv="X-UA-Compatible" />
    <title>TinTao - 飒易互联</title>
    <style type="text/css">
    *,html{
        padding: 0;
        margin: 0;
    }
    html{
        overflow: hidden;
    }
    </style>
</head>

<body>
    <div class="fbd">
        <iframe id="ibox" src="http://www.saecn.com" frameborder="0" width="100%" height="506"></iframe>
    </div>
</body>
<script src='http://code.jquery.com/jquery-1.10.0.min.js' type="text/javascript" language="javascript"></script>
<script type="text/javascript">
    setFrameH();
    window.onresize = function() {
        setFrameH();
    };
    function setFrameH(){
        var $ibox = $("#ibox");
        var height = $(window).height();
        if (height < 0)
            height = 1;
        $ibox.height(height);
    }
</script>
</html>

在线案例请移动这里：JS+CSS浮动框架加载连接自适应宽高

基于jQuery的五子棋等多子棋游戏插件

今天早上一来呢就将多子棋插件版本更新到V0.1.1，主要原因是昨晚回家完了一下，发现这个游戏在某种特定的情况下会失去判断输赢的情况，接下来就列一下这个插件的详细信息：

/******************************************
* 多子棋插件
*
* @作者 ：听涛设计
* @版权 ：Copyright (c) 2013 听涛TinTao.
* @网址 ：http://www.saecn.com
* @更新 : 2013-05-08
* @版本 ：Version 0.1.1
*
******************************************/

主要功能：

1.可以实现多子棋游戏效果；

2.可以自由设定多少棋子连成串可以赢；

3.可以设置游戏画布的宽高；

游戏源码已经更新到GitHub：https://github.com/jactorew/wzGame

DEMO可以移步：jQuery五子棋游戏

欢迎大家多多指正多提意见。

游戏缺点：

UI素材来自互联网，没有独立的CSS样式文件，对于修改皮肤比较困难。

教你在Seajs中如何使用Jquery和Jquery的插件

最近了解到seajs的模块化js开发不错，拿来一看，呵呵，傻眼了。seajs做原生javascript开发还不错，就是像我这样的jquery控木有办法了。在细心翻阅了seajs官方文档后发现，原来seajs提供有配置jquery的方法，于是乎博主就开始照着文档开始配置，结果是文件下载下来了，但是全部报错，咋个回事呢？？？代码如下：

seajs.config({
plugins: ['shim'],

alias: {
'jquery': {
src: './lib/jquery.1.8.2.min.js',
exports:'jQuery'
},

'jquery.ui.core': {
src: './lib/jquery.ui/jquery.ui.core.min.js',
deps: ['jquery']
}
}
});

看起来不应该是这里的问题，完全按照官方文档写的啊！ 纠结了半天查阅了无数资料后，终于发现另一种在seajs中使用jquery和jquery插件的方法：

var $ = require('jquery');
require('./lib/jquery.ui/jquery.ui.core.min')($);

这个方法必须将所有的jquery和插件重新封装一次

define(function(require,exports,moudles){
return function(jQuery){
(function(){/*code*/})(jQuery);
}

})

这下就完美解决了，不过这种方法加载的jquery和插件只能在这个文件内部使用，相当于局部变量，页面和其他无依赖的js不能使用，好处是插件与框架间无干扰。

Jquery中对新增对象live绑定时间hover的另类处理

Jquery中对新增对象live绑定时间hover的另类处理：

在项目中发现对新增对象使用hover方法时，live的绑定方式貌似不大对，结果测试页的确说明绑定的hover时间无效，翻阅jquery API发现live只能绑定这类事件：

在jQuery 1.4.1 中，.live() 能接受多个，用空间分隔事件，在提供类似.bind()的功能 。例如，我们可以“live ” 同时绑定mouseover和mouseout事件,像这样：

$('.hoverme').live('mouseover mouseout', function(event) {
if (event.type == 'mouseover') {
// do something on mouseover
} else {
// do something on mouseout
}
});

随后又发现：

$(".hoverme").live({ 
  mouseenter: function() { //todo }, 
  mouseleave: function() { //todo }
});

这个比较能够接近hover实现的效果，至于实际应该怎么用看实际应用情况而定。

返回首页

欢迎大家来到我的小站

TinTao在这里分享、收藏了很多前端、后端、设计、管理等方面的知识，让我们一起学海无边苦作舟吧！

return top