我有this ASP.NET页面,其中包含ASP.NET UpdatePanel和jQueryUI可放置和可排序的组件。该页面适用于所有浏览器,但不适用于Internet Explorer(经过IE8测试)。
在我尝试调用ASP.NET AJAX事件后(通过按下UpdatePanel中的我的asp.net按钮),我的可排序列表在IE浏览器中停止正常工作,浏览器抛出以下错误:
消息:未指定错误。 行:145 查尔:186 代码:0 URI:http://code.jquery.com/jquery-1.4.2.min.js
我发现问题是由第66行的代码引起的:
$("#droppable").droppable();
如果我发表评论,那么在ajax回发之后,可排序列表工作正常。但它没有意义。
有谁知道可能出现什么问题?
感谢。
P.S。我正在使用jQueryUI 1.8.1 和jQuery 1.4.2
答案 0 :(得分:1)
答案 1 :(得分:0)
可以在此处找到问题的解决方案 - http://pastebin.org/236945
<%@ Page Language="C#" AutoEventWireup="true" %>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<style type="text/css">
#sortable
{
list-style-type: none;
margin: 0;
padding: 0;
border: solid 1px #999999;
}
#sortable li
{
margin: 0.3em 0.3em 0.3em 0.3em;
padding-left: 1.5em;
font-size: 1em;
height: auto;
border: dotted 1px #999999;
background-color: #dddddd;
}
#sortable li:hover
{
background-color: #aaaaaa;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager runat="server" ID="srptManager">
<Scripts>
<asp:ScriptReference Path="http://code.jquery.com/jquery-1.4.2.min.js" />
<asp:ScriptReference Path="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js" />
</Scripts>
</asp:ScriptManager>
<asp:UpdatePanel ID="updPanel" runat="server">
<ContentTemplate>
<ul id="sortable">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
<li>Item 4</li>
<li>Item 5</li>
</ul>
<div id="droppable" style="background-color: black">
Drop Here</div>
<asp:Button runat="server" ID="btnAjaxRefresh" Text="Go" />
</ContentTemplate>
</asp:UpdatePanel>
<script type="text/javascript" language="javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
// *******Solution Here*******
Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);
function EndRequestHandler(sender, args) {
if (args.get_error() == undefined) {
jqueryStuff();
}
}
function BeginRequestHandler(sender, args) {
$("#sortable").sortable("destroy");
$("#droppable").droppable("destroy");
}
function jqueryStuff() {
$(document).ready(function() {
$("#sortable").disableSelection();
$("#sortable").sortable();
// ******Problem at this line******
$("#droppable").droppable();
});
}
jqueryStuff();
</script>
</form>
</body>
</html>