2011 三月 | Mr.Think的博客

【西安】求贤令：智讯互动渴求UI设计师一名

Posted by Mr.Think on 03/17/2011 1 comment

——听说你跳槽了？回西安了？
——恩。
——薪水很高吗？
——跟原来差不多。
——那你去那儿干啥？
——购买力增强三倍。
再次求贤，我们急需一名UI设计师！
基本要求：
·了解网站前端界面设计，对用户体验有深入理解；
·美术感好，有很强视觉表现力；
·对Flash、Photoshop、Illustrator等相关工具应用自如；
·美术、设计或相关专业
·痴迷于创意，热心于品牌视觉设计，善于把握潮流动向；
如有以下技能，狠狠加分！
·熟悉HTML语言，掌握Dreamweaver等制作工具；
·熟悉XHTML+CSS网页布局；
·熟悉Flash ActionScript 动画设计；
·有传统广告公司经验，或有成熟平面设计作品；
·有手绘功底。
薪资：
能力决定薪水！我们提供高于西安同行业的薪资。
公司介绍：
智讯互动，西安首家整合互动营销机构，已搞定西安最优质的客户，万事具备，只欠猛人。
我们提供与京广沪相同水平的薪水，在西安这座很有味道的城市，大家可以过上更体面的生活。
热切欢迎业内的西安游子回来。
我们的人才理念很简单：
·我们诚挚的邀请优秀的人才加盟，并为他们创造尽量宽松、愉快的工作环境。
·我们推崇专注而高效的工作，轻松开放的沟通，用创造性的想法解决问题。
·我们提供高于同城行业标准的薪水，能让你在这个城市里体面、有尊严的生活。
在我们的团队中，有艺术生、文科生、理科生、退学生；
有人热衷相声表演，有人钻研佛教文化，也有人喜欢泡淘宝和豆瓣；
有人是手持设备技术发烧友，有人是游戏狂人，霸占公司那台Wii；
我们鼓励背景各异的人在此互相分享，激荡创造力。
投递:
cnbluebird#gmail.com（非诚勿扰）

招聘

【上海】求前端开发一名

Posted by Mr.Think on 03/17/2011 0 comments

帮朋友公司招的，募前端开发工程师一名。
职位要求:
1. 学历性别年龄不限；
2．熟练掌握(X)HTML+CSS，能编写结构良好各浏览器兼容的CSS，语义化的符合W3C标准的HTML；
3．熟练运用javascript以及常用javascript框架，如：jQuery；
4．熟练使用PS, FW等制图工具，有一定的美感；
5．对用户体验，SEO有了解；逻辑分析能力强，较强的学习能力，善于沟通，有良好的团队合作精神；
6．有后端(如:php或java)开发经验者优先考虑。
公司介绍
上海韬人通信技术有限公司是一家以移动通讯信息技术为核心的高科技企业，引领移动商务领域发展的专业公司。依托并支持移动、联通、电信、网通的大型短信平台从事软件开发、移动数据业务及行业短信解决方案。拥有远见的市场概念模式，非常规的理念，精准营销、高效、智能化的应用平台及增值服务，世界领先的互联网技术提供商的战略合作伙伴，并保持与全球领先的同步技术交流在日趋激烈竞争的环境中不断的超越自己，超越竞争！
联系及薪资
薪资4000+福利, 上海,徐汇.
欢迎在上海或愿意到上海发展的朋友投简历至 support@tworing.com.cn . 合则约见.

招聘

原生AJAX入门讲解（含实例）

Posted by Mr.Think on 03/12/2011 5 comments

相对于jQuery、YUI以及其他一些类库的AJAX封装，原生JS的AJAX显得那么的尴尬，兼容性不好，要记很多的方法属性，调用不便捷，代码臃肿…但我还是想说，原生JS才是最根本最底层的知识（虽然实际项目中我也是以jQuery AJAX为主，为什么？高效！），求木之长者，必固其根本。
什么是AJAX? 它的优点劣势是什么？
Asynchronous JavaScript and XML（异步JavaScript和XML），是一种创建交互式网页应用的网页开发技术。简单的说它是多种技术的组合，目的就是让前台的数据交互变得更快捷，不用刷新页面就可以完成数据的更新。关于它的概念，止于此。想了解更多，请前往：http://zh.wikipedia.org/zh/AJAX
优点很明显，利于用户体验，不会打断用户的操作，在不刷新页面的情况下更新内容，减小服务器压力也是它很硬性的一个优点；而缺点，除了倍受追捧的SEO问题，安全问题、前进后退（这个虽然可以用其他方法解决，但AJAX本身的机制还是没变）、破坏程序的异常机制以及对新兴手持设备支持不完美的问题都是它现存的一些缺点。人无完人，AJAX也是如此，我们并不能因为它有缺点而摒弃它。
什么地方需要AJAX?
其实这是一个太宽泛的问题，各人各项目都有不同的用处，依我的经验与理解，AJAX应该用于小面积更新数据而不希望整个页面刷新的情况下使用。比如对用户名或者注册邮箱等数据判断、内容选项卡内容、弹出的登录注册窗口以及用户提交信息后的反馈信息等等。
实践出真知！
崇尚思考加实践，我坚信这是深入任何一门技术的必备法宝。下面，我就以一个常用的验证用户是否使用的实例，浅尝辄止的讲解一下基础的AJAX。查看样例演示
验证用户名这种数据判断，不用多说了，会一点点前端的人都知道是必须的。最传统的模式可能是输入信息，然后用户点提交后alert出一个窗口，告诉用户XXX用户名已被注册，请重新输入！我讨厌极丑的alert框！我想大多用户也是一样。此时，AJAX就可以华丽登场了。当用户输入完名字后，在表单外任何地方点一下（失去焦点），AJAX就迅速把用户输入的信息反馈到服务器端判断，并迅速返回一个信息告知用户输入的昵称是否可用。如此，我们需要一个前台的输入表单，代码如下：


<p>用户名：
</p>

另外，我们还需要一个判断输入昵称是否存在的后端页面（本文以PHP为例，这部分不用细究）:

...
if(isset($_GET['entryname'])){
	$entryname=$_GET['entryname'];
}else{
	$entryname='DATA NULL';
}
$sql=sprintf("select * from i_test_ajax where nickname='%s'",$entryname);
$res=$iajax->query($sql);
//sleep只是为了展示readState==1时的效果
sleep(1);
if(($res->num_rows)>0){
	echo "抱歉！此昵称已存在 :(";
}else{
	echo "恭喜！此昵称可注册 :)";
}
...

如此，万事俱备，只欠东风，剩下的就交给AJAX来处理了。
XMLHttpRequest，不得不提的一个对象，AJAX最核心也是最底层的对象。可悲哀的是，它是W3C的一个标准，但微软IE一直很自我（微软IE）。怎么办？当然是用一个方法和谐掉它们。微软IE支持ActiveXObject(‘Microsoft.XMLHTTP’)对象，这样就简单了：

//兼容的XMLHttpRequest对象
IXHR: function(){
	if(window.ActiveXObject){
			XHR=new ActiveXObject('Microsoft.XMLHTTP');
		}else if(window.XMLHttpRequest){
			XHR=new XMLHttpRequest();
		}else{
        	return null;
        }
}

兼容的XMLHttpRequest对象实现了，接下来写一个简单的onblur事件，即当输入值后，表单失去焦点后开始判断并迅速回馈一个信息到前台。代码如下：

//触发焦点时执行
document.forms['iform'].nickname.onblur = function(){
    //输入的值
    var val=document.forms['iform'].nickname.value;
    //对用户名的判断
    if(!/^[a-zA-Z0-9_]{3,16}$/.test(val)){
		alert('请输入3~16位由英文、数字、下划线组成的昵称！');
		return false;
    }
    //初始化一下XHR
    iBase.IXHR();
    //原来需要新打开的判断页面用GET使用异步
	XHR.open('GET','/demo/ajax/iajax20110306_query.php?entryname='+val,true);
	//与readyState属性有关，当readyState改变时它才会触发
	XHR.onreadystatechange=returnFun;
	//异步处理完成后发送数据出去（比如某些需要在焦点事件后再执行的）
	XHR.send(null);
}

解释一下AJAX部分的代码。iBase.IXHR()，初始化XHR，以保证XMLHttpRequest对象的兼容。接下来，通过以GET的方式，异步发送到/demo/ajax/iajax20110306_query.php页面进行验证。有人会问什么是GET，GET是从服务器上请求数据，GET方法就是把数据参数队列加到一个URL上，值和表单是一一对应的，比如本文的entryname=val。这个概念可能属于后台程序的范畴，不在此细说。然后，我们需要用到一个onreadystatechange事件属性，这个属性是用来存储函数（或函数名），每当readyState属性改变时，就会调用该函数，即本文中的returnFun；最后，我们还要发送一个数据到服务器，send属性一般用于数据交换,而本文只是一个简单的验证判断，所以，send一个空值。
基本的判断与数据发送完成了，接下来还剩一个关键的信息获取，即returnFun。先看代码：

function returnFun(){
    //当send()已调用，正在发送请求时，显示Loading...
	if(XHR.readyState==1){
		iBase.Id('tips').innerHTML='Loding...';
	}else if(XHR.readyState==4){
		//当响应内容解析完成，可以调用时
		//更缜密，再判断一下status是否成功
		if(XHR.status==200){
			//responseText为返回的文本
			iBase.Id('tips').innerHTML=XHR.responseText;
		}
		//使用完请销毁，避免内存泄露
		XHR=null;
	}
}

此函数是用来通过判断readyState及status状态也及时反馈给用户相应的提示信息。readyState有五种状态：
　　0 (未初始化)： (XMLHttpRequest)对象已经创建，但还没有调用open()方法；
　　1 (载入)：已经调用open() 方法，但尚未发送请求；
　　2 (载入完成)：请求已经发送完成；
　　3 (交互)：可以接收到部分响应数据；
　　4 (完成)：已经接收到了全部数据，并且连接已经关闭。
如此一来，你应该就能明白readyState的功能，而status实际是一种辅状态判断，只是status更多是服务器方的状态判断。关于status，由于它的状态有几十种，我只列出平时常用的几种：
　　100——客户必须继续发出请求
　　101——客户要求服务器根据请求转换HTTP协议版本
　　200——成功
　　201——提示知道新文件的URL
　　300——请求的资源可在多处得到
　　301——删除请求数据
　　404——没有发现文件、查询或URl
　　500——服务器产生内部错误
至此，一个简单的AJAX验证实例就完成了：查看样例演示

关于AJAX的基础介绍与实例就这么多，关键还是在于自己的实践与思考。其实这其中涉及知识并不复杂，若有后端程序的基础，学起AJAX会更加容易，关键是要想明白其中的逻辑关系。有兴趣的话，可以自己写一个不刷新页面加载新内容的AJAX，或者研究一下jQuery中关于AJAX的封装。

JavaScript

【西安】求贤令：智讯互动渴求1~2名PHP大牛

Posted by Mr.Think on 03/03/2011 2 comments

——听说你跳槽了？回西安了？
——恩。
——薪水很高吗？
——跟原来差不多。
——那你去那儿干啥？
——购买力增强三倍。
要求：
1. 只招猛人，菜鸟绕行！
2. 高效、专注、诚实、负责，能承受高强度工作；
3. 精通PHP+MySQL，熟悉WAMP开发流程,能写优质的代码；
4. 一年以上商用网站开发经验，熟悉XHTML/CSS/JAVASCRIPT及AJAX技术者优先；
薪资：
提供京广沪相同水准的薪水及同等的福利（不明确？能力决定薪水）。
公司介绍：
智讯互动，西安首家整合互动营销机构，已搞定西安最优质的客户，万事具备，只欠猛人。
我们提供与京广沪相同水平的薪水，在西安这座很有味道的城市，大家可以过上更体面的生活。
热切欢迎业内的西安游子回来。
我们的人才理念很简单：
·我们诚挚的邀请优秀的人才加盟，并为他们创造尽量宽松、愉快的工作环境。
·我们推崇专注而高效的工作，轻松开放的沟通，用创造性的想法解决问题。
·我们提供高于同城行业标准的薪水，能让你在这个城市里体面、有尊严的生活。
在我们的团队中，有艺术生、文科生、理科生、退学生；
有人热衷相声表演，有人钻研佛教文化，也有人喜欢泡淘宝和豆瓣；
有人是手持设备技术发烧友，有人是游戏狂人，霸占公司那台Wii；

我们鼓励背景各异的人在此互相分享，激荡创造力。
投递:
cnbluebird#gmail.com（非诚勿扰）

招聘

Mr.Think

专注Web前端技术,热爱PHP,崇尚简单生活的凡夫俗子.

基于jQuery的可用于选项卡及幻灯的切换插件

【西安】求贤令：智讯互动渴求UI设计师一名

【上海】求前端开发一名

原生AJAX入门讲解（含实例）

【西安】求贤令：智讯互动渴求1~2名PHP大牛

分类

功能

热门文章

存档

最新评论

资源链接

友情链接