【发布时间】：2012-10-24 11:37:38
【问题描述】：
我已经创建了 4 个 jQuery 对话框，如下所示：
<div id="addCustomer" title="Add Customer">
<h2>Add Customer</h2>
<label>Customer Name: </label><input type="text" name ="customerName" id="addCustomerName"/><br/>
<input type="button" value="Submit" id="addCustomerBtn" /><br/>
<a href="#" id="close">Close</a>
</div>
<div id="editCustomer" title="Edit Customer">
<h2>Edit Customer</h2>
<label>Customer Name: </label><input type="text" name="editCustomerName" id="editCustomerName"/>
<input type="button" value="Submit" id="editCustomerbtn"/> <br/>
<a href="#" id="editClose">Close</a>
</div>
<div id="deleteCustomer" title="Delete Customer">
<h2>Delete Customer</h2>
<label>Are you sure you want to delete this customer?</label><br/><br/>
<input type="button" value="Yes" id="confirmDeleteCustomer"/> <input type="button" value="No" id="cancelDeleteCustomer"/>
</div>
<div id="addDevice" title="Add Device">
<h2>Add Device</h2>
<label>Device Id: </label><input type="text" name="addDeviceId" id="addDeviceId"/><br/><br/>
<label>Version: </label><input type="text" name ="addDeviceVersion" id="addDeviceVersion"/><br/>
<input type="button" value="Submit" id="addDeviceBtn"/> <br/>
<a href="#" id="addDeviceClose">Close</a>
</div>
我已将它们设置为隐藏，从页面开头开始，如下所示：
$("#addCustomer").dialog({
autoOpen: false,
draggable: true
});
$("#deleteCustomer").dialog({
autoOpen: false,
draggable: true
});
$("#addDevice").dialog({
autoOpen: false,
draggable: true
});
$("#editCustomer").dialog({
autoOpen: false,
draggable: true
});
现在我正在尝试从上下文菜单上的一个选项中调用每个选项，如下所示，但是当我尝试时，我选择打开的第一个对话框可以正常打开，但是一旦关闭，就不会打开任何对话框再次在页面上。
if (e.item.name == "itmAddCustomer") {
$(function() {
$("#addCustomer").dialog("open");
});
}
我在这里只展示了一个菜单按钮的例子，但你明白了要点。
谁能告诉我如何解决这个问题？
干杯
更新：这是与以下答案相关的上下文菜单的代码：
<div id="popupMenu" style="z-index:19998;display:none;">
<div class="dxm-popupMain dxm-shadow dxm-popup">
<ul class="dx dxm-noImages dxm-gutter">
<li class="dxm-item"><div class="dxm-content dxm-hasText">
Expand
</div><b class="dx-clear"></b></li><li class="dxm-spacing"></li><li class="dxm-item"><div class="dxm-content dxm-hasText">
Enable
</div><b class="dx-clear"></b></li><li class="dxm-spacing"></li><li class="dxm-item"><div class="dxm-content dxm-hasText">
Add Customer
</div><b class="dx-clear"></b></li><li class="dxm-spacing"></li><li class="dxm-item"><div class="dxm-content dxm-hasText">
Edit Customer
</div><b class="dx-clear"></b></li><li class="dxm-spacing"></li><li class="dxm-item"><div class="dxm-content dxm-hasText">
Delete Customer
</div><b class="dx-clear"></b></li><li class="dxm-spacing"></li><li class="dxm-item"><div class="dxm-content dxm-hasText">
Add Device
</div><b class="dx-clear"></b></li>
</ul>
</div>
</div>
</div>
【问题讨论】：
-
您的浏览器控制台上是否出现任何 javascript 错误？你能把所有这些都放在一个 jsFiddle 中吗？
-
为什么不把所有的选择器放在一起？
-
您是否尝试在创建新对话之前破坏对话？内部关闭事件，类似于 $(this.)dialogue("destroy");
-
@pistache 是的，我确实这样做了。 js错误是Uncaught TypeError: Object function (a,b){return new p.fn.init(a,b,c)} has no method 'curCSS'
标签： javascript jquery jquery-ui web dialog