项目开发小Tips

1.给UL加个高度，可以去掉其缺省的高度，产生的过高的问题。

 

    #sebar ul{ list-style:none; padding:0;margin-top:0;height:20px;}
    #sebar .lisep{border-left:1px solid blue ;border-right:1px solid blue;height:20px}
    #sebar ul li{float:left;margin-left:3px}

 

 

 2.编写js组件时，常常会用到点击文档其它部分关闭弹出窗口或下拉菜单的功能。

这时可以在代码中加入如下，使用mousedown可以避免其它控件阻止Click冒泡

 

               $(document).mousedown(function(){
                main.$dialog.hide();
               });

如果希望点击弹出窗口或下拉菜单，不会关闭，可以在对应的事件中阻止事件冒泡

示例代码如下：

 

main.$dialog.mousedown(function(e){
               e.stopPropagation();
               return false;
               });

 3.验证只能为数字或字母

 

function validateNoSpace(a,v,h)
{
    var reg=/^\w+$/g;
    var reg1=/^[^_]+$/g
    if(reg.test(a)&&reg1.test(a))
    return [true,""];
    else
    return [false,v+":只能为数字,字母,不能包含空白字符及其它字符！"];
     
}

 

4.JavaScript Timing Events

With JavaScript, it is possible to execute some code after a specified time-interval. This is called timing events.

It's very easy to time events in JavaScript. The two key methods that are used are:

• setTimeout() - executes a code some time in the future
• clearTimeout() - cancels the setTimeout()

Note: The setTimeout() and clearTimeout() are both methods of the HTML DOM Window object.

---

The setTimeout() Method

Syntax

var t=setTimeout("javascript statement",milliseconds);

 

 

5.firefox中$("#con").width(parent.getNavPanelW()*1-25).css("margin","5 auto");会失效，改为

$("#con").width(parent.getNavPanelW()*1-25).css("margin","5px auto");即可

 

6.常用的表单元素横排布局

 

5.    #sebar input{width:100px;border:1px solid #83B3D8;float:left;display:inline;margin-left:5px;}
    #sebar label{float:left;display:inline;margin-left:5px;padding:0;line-height:20px;}
    #sebar select{border:1px solid #83B3D8;background:#EBF5FD;float:left;margin-left:5px;display:inline}
    #sebar ul{ list-style:none; padding:0;margin:0;height:20px;}


              <div style="height:20px; margin:5px 0;padding:0;" id="sebar">
      <select onchange="updateDate('dateSpan','dateFrom','dateTo');" name="dateSpan" id="dateSpan">
                            <option value="today">今日</option>
                            <option value="theWeek" selected="selected">本周</option>
                            <option value="theMonth" >本月</option>
                            <option value="theQuarter">本季度</option>
                            <option value="theYear">今年</option>
                            <option value="lastWeek">上周</option>
                            <option value="lastMonth">上月</option>
                            <option value="lastQuarter">上季度</option>
                            <option value="lastYear">去年</option>
                            <option value="last7Day">近7天</option>
                            <option value="last30Day">近30天</option>
                            <option value="allTheTime">全部</option>
                            <option value="custom">自定义</option>
                        </select>
                        <label>从</label>
                        <input type="text" onchange="updateType('dateSpan');" value="" name="dateFrom" id="dateFrom"
                            class="datepic"/>