jquery怎么设置控件位置

方法：先需要设置控件的position属性，position 属性规定元素的定位类型，这个属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。若有多个层 切需要设定层的层次关系 那么需要设置z-index属性。

举例如下：

jquery如何设置控件位置

//offset()获取当前元素基于浏览的位置

var offsettop=$("#unamespan").offset().top

var offsetleft=$("#unamespan").offset().left

//position()获取当前元素基于父容器的位置

var positiontop=$("#unamespan").position().top

var positionleft=$("#unamespan").position().left

//设置panel2的位置基于unamespan的坐标

$("#panel2").css({position: "absolute",'top':offsettop+100,'left':offsetleft+50,'z-index':2})

　引用正确路径下的WdatePicker.js后可以用以下两种方式

1.在定义列时在editoptions的dataInit写一个function，好处是不管是添加还是修改时都能显示日历控件，如下

{name:'dt',index:'dt',editable:true,

editoptions:{

dataInit:function(el){

　 $(el).click(function(){

　 WdatePicker()

　 })

}

}

}

2.在分别添加和修改中的beforeShowForm写一个function，好处是分别控制，如果只想在添加或者修改时显示日历控件就可以在需要的地方写,如下

.navGrid('#pagerb',{

add:true,edit:true

}

,{

url:"url",

beforeShowForm:function(frmgr){

jQuery("#dt",frmgr).click(function(){

　 WdatePicker()

})

}

},

{

url:"url",

beforeShowForm:function(frmgr){

jQuery("#dt",frmgr).click(function(){

　 WdatePicker()

})

}

},

'',

'',

''

)

完整如下

jQuery("#list").jqGrid({

url:"jqgriddata2.asp",

datatype: "json",

colNames:['No','date'],

colModel:[

　 {name:'id',index:'id',width:300},

　 {name:'dt',index:'dt',width:400,sortable:false,search:false,editable:true,

　 editoptions:{

//方式1

// dataInit:function(el){

// $(el).click(function(){

//　 WdatePicker()

// })

// }

　 }

　 ,editrules:{edithidden:true,required:true,date:true}}

],

rowNum:30,

rowList:[10,20,30],

pager: jQuery('#pagerb'),

caption: "test"

})

.navGrid('#pagerb',{

　 add:true,edit:true

}

,{

　 //方式2

　 url:"url",

　 beforeShowForm:function(frmgr){

　 jQuery("#dt",frmgr).click(function(){

WdatePicker()

　 })

　 }

},

{

　 //方式2

　 url:"url",

　 beforeShowForm:function(frmgr){

　 jQuery("#dt",frmgr).click(function(){

WdatePicker()

　 })

　 }

},

'',

'',

''

)

不过发现用My97DatePicker有个bug，就是点击日期文本框d出日历选择完后，再点击日期文本框的时候不能显示日历控件，要再次点击才能显示日历控件，使用jquery ui里面的datepicker就没这问题

而且jqgrid支持换肤，datepicker也支持，所以个人认为用datepicker好些，换肤的时候风格能保持统一。

custom_func function custom设置为true时需要配置此函数。

函数参数，输入控件的值，name名称（来自colModel）。

函数需要返回一个数组包含以下项目 第一项：true/false，指定验证是否成功

第二项：当第一项为false有效，显示给用户的错误信息。

格式如：[false,”Please enter valid value”]！

---