JQuery弹出框定位实现方法

作者：Terry2017.05.09来源：Web前端之家浏览：13228评论:2

关键词：JQuery JS

JQuery弹出框定位实现方法。直接上代码：

//页面代码 (简化) 
<asp:TextBox ID="tbOperation2" runat="server" onclick="buttonclick($(this))" 
CssClass="ui-button-icons-only" Text="按钮"></asp:TextBox> 
<div id="editdialog" title="Basic dialog"> 
<div> 
<label onclick="clickEdit();" class="labelbutton"> 
Edit</label> 
</div> 
<div> 
<label onclick="clickView();" class="labelbutton"> 
View</label> 
</div> 
<div> 
<label onclick="clickBuild();" class="labelbutton"> 
Build</label> 
</div> 
</div>

JS：

<script type="text/javascript"> //页面初始化的时候 
var staticsignal; 
$(function() { 
// a workaround for a flaw in the demo system (http://dev.jqueryui.com/ticket/4375), ignore! 
$(":input.ui-button-icons-only").button(); //更改textbox的样式 
}); 
</script> 
<script type="text/javascript"> 
function buttonclick(e) 
{ 
var offset=e.offset();//得到offset 
var x=offset.left; 
var y=offset.top; 
$("#editdialog").dialog({ 
autoOpen:true, 
draggable:true, 
resizable:false, 
position:[x,y+35], //设置坐标 
width:150 
}); 
$(".ui-dialog-titlebar").hide(); 
$('a.ui-dialog-titlebar-close').hide(); 
staticsignal=e; 
} 
</script>