最近工作中的小细节

最近工作期间,发现自己犯下的错误以及小细节。
下面列出一些,做个记录,俗话说好记忆不如烂笔头。

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','&#34;').replace('/\'/g','&#39;');
});
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,'&#039;').replace(/"/g,'&quot;')
   };
   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] );

posted on 2012-06-14 07:20  jQing  阅读(261)  评论(0编辑  收藏  举报

导航