最近工作期间,发现自己犯下的错误以及小细节。
下面列出一些,做个记录,俗话说好记忆不如烂笔头。
1: 将用户提交来的数据打包成一串json字符串,注意数据中是否包含"、'、\n(换行) 、\r(回车) 等字符
解决: 可以在客户端或服务端 使用正则替换函数将其替换为空或者 html实体字符
例:
<?php
$json = $_POST['json'];
//注意使用Ajax POST方式 或者http POST方式 包含"将会被自动转义,所以请先url编码(encodeURIComponent)
$json = preg_replace('/\n|\r|\n\r/','',$json);
?>
var json = $('#form').serializeArray();
$.each(json,function(){
this.value = this.value.replace('/"/g','"').replace('/\'/g',''');
});
2:将字符串转换成可以执行的javascript语句
技巧: 将数据作为dom元素的一个属性,存储在dom元素中,这技巧 我经常使用。
例:
<input type="hidden" id="data" data-val="{id:'1',text:'ac'}">
<script>
var hid = document.getElementById('data');
var json= eval( '('+ hid.getAttriute('data-val') +')');// 非IE浏览器可写为 : hid.data.val
for(var i in json)
{
alert(i+':'+json[i]);
}
</script>
3:将元素定位至浏览器的中心位置 (- -小学题目,唉!我可以重新上小学了。)
//rowserWidth:浏览器宽度, divWidth:被定位容器元素, 定位至中心,浏览器、容器中心点则重合
算法1: (rowserWidth - divWidth)/2
算法2: rowserWidth/2 - divWidth/2 //虽然是上面算法的提取公因式
4:javascript dom 对象数组形式
<div id="div">This is 'div'</div>
<script>
var div = document.getElementById('div');
alert(div.innerHTML);
alert(div['innerHTML']);
// 以上打印的效果是一样,难怪for in 可以将对象 以数组的形式打印出其值
</script>
5:javascript语法不是很严格
//当不确定js是否支持该语法的时候,请不要怕麻烦,多弄点例子试试
当我们在这个页面创建 变量,函数时
javascript 会把这个变量或方法 归属于 window对象中
及全局变量,全局方法
var test ='aaa';
function Test(){
alert(test);
}
alert(window.test);
window.Test();// 方法名称(),这样才能执行函数
// 某人 window.onload = Test();这样写,我感到十分同情与无奈。
//不习惯 为某个函数定义多个形参,可以将该参数组织成对象
function look(arg){
for(var i in arg){
alert(arg[i].contructor);
}
}
look({name:'ac',value:'ac',fn:function(){alert(111)}});
6:所谓的jsonp,只不过是借助script标签可以跨域的特性,解决Ajax的局限性,同样这种方法局限性也很大
<script type="text/javascript">
function callack(arg){
for(var i in arg)
{
alert(arg[i]);
}
}
</script>
<script type="http://www.domain.com/index.php?jsonp=callack"></script>
<?php
//服务端
$callack = $_GET['jsonp'];
echo $callack.'({name:'ac',value:'ac'})';
?>
还有好多,想不起来了,今天就到此为止吧。 晚安
2012年4月25日
解决 IE6下 定位层 无法覆盖Select的问题 [CSS]
因select在IE6中被是为窗口级元素,可在指定定位层中加入 iframe 元素,可达到ie6下定位层覆盖select的问题。
解决 word 设置重复页眉问题
在 页眉工具栏中 将"同上节"点掉
点击章节 -> 拆分章节 -> 下一页分节符
2012年4月26日
<?php
// 使用 str_replace 替换多个字符串 [PHP]
$a = '<?php echo 1111;?>';
echo str_replace(array('<?php','?>'),'',$a).'<r />';// echo 1111;
echo preg_replace('/<\?php|\?>/','',$a);// echo 1111;
?>
<?php
/*将字符串转换成可执行的PHP代码,字符串中不包含<?php ... ?> [PHP]*/
$a = 'echo md5(11111);';
eval($a);
?>
// 使 HTML 元素 进入编辑模式
<!--[HTML]-->
<ody contentEditale="true">
<pre>HTML ody edit</pre>
</ody>
2012年4月27日
1.获取事件的发生源头[javascript]
IE:
event.srcElement
!IE
event.target
2.Mysql 用户变量[mysql]
set @num=1,@a=0,@count=NULL;
select @count:=@num+@a;
3.HTML判断浏览器[HTML]
IE下:
<!--[if IE]>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/lis/jquery/1.7.2/jquery.min.js"></script>
<![endif]-->
!IE下:
<!--[if !IE]><!-->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/lis/jquery/1.7.2/jquery.min.js"></script>
<!--<![endif]-->
4.IE6下png实现透明
<style>
#g{
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='g.png',sizingMethod='scale')
}
</style>
2012年4月28日
//向所有字符串对象增加属性与方法
String.prototype.Replace = function(){
return this.replace(/'/g,''').replace(/"/g,'"')
};
String.prototype.alert = function(){
alert(this);
};
var i = 'ABCDEDF';
i.alert()// ABCDEF
Chrome、Firefox、Safari全屏API
var d=document.getElementsByTagName("html")[0];
try{
d.wekitRequestFullScreen();//Safari 5+ 、Chrome 15+,针对于wekit内核浏览器
d.onwekitfullscreenchange=function(){alert(1)}}
}
catch(e){
d.mozRequestFullScreen();//Firefox 11+ 针对于FF
d.onmozfullscreenchange=function(){alert(1)}
}
[/code]
2012-05-05
[MySQL]快速解决"is marked as crashed and should e repaired"故障
转自: [url]http://www.cnlogs.com/hakuci/archive/2012/03/20/2407723.html[/url]
运行 > cmd > myisamchk -c -r "磁盘:\mysql\data\talename\tale.MYI"
2012-05-14
//创建excel坐标
$array = array();
fn_excel_coord($array);
function fn_excel_coord(&$array,$end='')
{
$end = intval($end);
$letterEnd = ($end && ($end <=26)?$end:1);// 1 ~ 26
for($i=0;$i<26;$i++){ // A~Z..
$array = chr(65+$i);
}
for($i=0;$i<$letterEnd;$i++)//AA-ZZ
{
for($v=0;$v<26;$v++)
{
$array = chr(65+$i).chr(65+$v);
}
}
// A-Z,AA-ZZ
}
[/code]
2012-05-19
Google Chrome 用户数据默认路径
C:\Documents and Settings\Administrator\Local Settings\Application Data\Google\Chrome\User Data\Default
Extensions:插件数据
Local Storage:本地储存
...........
GOOGLE 云输入法 API
[url]https://developers.google.com/transliterate/v1/getting_started?hl=zh-CN[/url]
2012-06-05
解决ST2 MVC 找不到数据模型的BUG
1.
ST2 deug : [WARN][XZNET.view.s.Board#applyStore] The specified Store cannot e found
问题描述 : 在ST2 MVC 模式下 没有找到可用的数据存储器
解决方案 :
【1】.store增加storeId属性 实例化已定义的store对象,view 中将 store 改为storeId(推荐)
例如:
// Store
Ext.define('XZNET.store.s.Board',{
extend : 'Ext.data.Store',
requires : [
'XZNET.model.s.Board'
],
config : {
model : 'XZNET.model.s.Board',
storeId : 'oardstroe',
data : [
{ title : 'Ext.data.Model'},
{ title : 'Ext.data.Store'},
{ title : 'Ext.app.Controller'}
]
}
});
Ext.create('XZNET.store.s.Board');
// View
Ext.define('XZNET.view.s.Board',{
extend : 'Ext.List',
xtype : 'oardview',
requires : [
'XZNET.store.s.Board'
],
config : {
id : 'oardview',
fullscreen : true,
store : 'oardstroe',
itemTpl : '<div>{title}</div>'
}
});
【2】.store增加alias(别名)属性,view 中将 store 改为 oject
例如:
// Store
Ext.define('XZNET.store.s.Board',{
extend : 'Ext.data.Store',
alias : 'store.oardstroe',
requires : [
'XZNET.model.s.Board'
],
config : {
model : 'XZNET.model.s.Board',
storeId : 'oardstroe',
data : [
{ title : 'Ext.data.Model'},
{ title : 'Ext.data.Store'},
{ title : 'Ext.app.Controller'}
]
}
});
// View
Ext.define('XZNET.view.s.Board',{
extend : 'Ext.List',
xtype : 'oardview',
requires : [
'XZNET.store.s.Board'
],
config : {
id : 'oardview',
fullscreen : true,
store : {
type : 'oardstroe'
},
itemTpl : '<div>{title}</div>'
}
});
2012-08-22
1.[fopen文件后,别忘记fclose关闭文件]
操作流程 : 上传附件使用move_uploaded_file移动文件并使用fopen打开文件,fread读取文件,并unlink此文件。
Error : unlink(upFile/i.vcf) [<ahref='function.unlink'>function.unlink</a>]: Permission denied in
解决 : 错误提示权限问题,原以为目录或文件没有删除权限,考虑windows下 administrator已是超级权限,应不会出现此问题,最后发现原来是打开文件后没
fclose的后果,导致打开的文件已没锁住,从而无法被删除。
2. CSS3 解决背景透明,字体不透明
background-color:rgba(0, 0, 0, 0.5)
3. javascript 创建新元素后 重复添加该元素,dom中只保留一个。
var div = document.createElement('div'); div.innerHTML = '...'; document.body.appendChild(div); document.body.appendChild(div);
2012-11-04
Ajax 已支持跨域,Chrome等浏览器扩展了xmlHttpRequest对象,服务端脚本只需设置可请求的域名即可实现跨域效果:header('Access-Control-Allow-Origin:*');
IE8+ 请使用 XDomainRequest 对象
2012-11-05
CSS 当父元素与子元素同为绝对定位元素时(同时脱离文档流),此时子元素的位置相对应父元素位置.
2012-11-30
jquery创建并行对象或者叫合并对象
如果有对象A ,B 现在我想要合并成对象C 从C里面可以找到A , B 及其子对象 怎么做?
1 var arr = new Array();
2 arr[0] = $(this).parents("tr")[0];
3 arr[1] = $(this).parents("tr").next()[0];
4 var dom = $(arr);
5 $(dom).find("td.title a").hide();
6 $(dom).find("td.title input").show();
$( [element1,element2,element3,element4] );