私は2つの異なるJavaScriptを実行するHTMLページを持っています。他のスクリプトをブロックするASP.NETのJavaScript
1つはオートコンプリートテキストボックス用で、もう1つはグリッドビュー上にマウスを置くためのものです。
私は最近ホバースクリプトを追加し、自動補完機能が停止しました。間違ったことをしています。
<%@ Page Language="C#" AutoEventWireup="true" Inherits="SearchER" CodeBehind="Search.aspx.cs" %>
<style type="text/css">
body {
font-family: Arial;
font-size: 10pt;
}
#form1 {
height: 645px;
}
.form-control {
}
td {
cursor: pointer;
}
.hover_row {
background-color: #FFFFBF;
}
</style>
<form id="form1" runat="server" style="background-color: #FFFFFF; font-family: tahoma; margin-left: 0px; margin-top: 0px;">
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.10.0.min.js" type="text/javascript"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.9.2/jquery-ui.min.js" type="text/javascript"></script>
<div style="background-color: white; height: 46px;">
<asp:HyperLink ID="HyperLink1" runat="server" Font-Names="Tahoma" Font-Size="X-Large" NavigateUrl="~/Default.aspx">Πίσω στο Εξοδολόγιο</asp:HyperLink>
</div>
<div style="margin-left: AUTO; margin-top: 100px; margin-bottom: 12px; font-family: tahoma; font-size: x-large; width: 627px; height: 63px; margin-right: auto;" align="center">
<script type="text/javascript">
$(document).ready(function() {
$("[id*=txtSearch]").autocomplete({ source: '<%=ResolveUrl("~/Search_CS.ashx") %>' });
});
</script>
<asp:Label ID="Label1" runat="server" Text="Find a name:"></asp:Label>
<asp:TextBox ID="txtSearch" runat="server" CssClass="form-control" autocomplete="ON"
Width="296px" OnTextChanged="txtSearch_TextChanged" BorderStyle="Solid" BorderColor="#507CD1" Height="22px" />
<asp:Button ID="Button1" Text="Find" runat="server" OnClick="Submit" BorderStyle="Solid" Height="26px" Style="margin-top: 0px; margin-left: 0px;" Width="96px" BorderColor="#507CD1" />
</div>
<div style="height: 412px; width: auto; margin-top: 0px; margin-left: auto; margin-right: auto;" align="center">
<asp:GridView ID="GridView1" runat="server" CellPadding="4" ForeColor="#333333" GridLines="None" AutoGenerateColumns="false" OnRowDataBound="OnRowDataBound" OnSelectedIndexChanged="OnSelectedIndexChanged" Height="150px" Style="word-break: keep-all; word-wrap: normal; margin-left: auto; margin-right: auto; width: auto; margin-top: 0px;" AllowSorting="True" CellSpacing="3">
<AlternatingRowStyle BackColor="White" />
<Columns>
<asp:BoundField DataField="TripID" HeaderText="id" />
<asp:BoundField DataField="EmployeeName" HeaderText="Όνομα" />
<asp:BoundField DataField="FromDate" HeaderText="Ημερομηνία-(από)" />
<asp:BoundField DataField="ToDate" HeaderText="Ημερομηνία-(μέχρι)" />
</Columns>
<EditRowStyle BackColor="#2461BF" />
<FooterStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<HeaderStyle BackColor="#507CD1" Font-Bold="True" ForeColor="White" />
<PagerStyle BackColor="#2461BF" ForeColor="White" HorizontalAlign="Center" />
<RowStyle BackColor="#EFF3FB" Font-Names="Tahoma" />
<SelectedRowStyle BackColor="#D1DDF1" Font-Bold="True" ForeColor="#333333" />
<SortedAscendingCellStyle BackColor="#F5F7FB" />
<SortedAscendingHeaderStyle BackColor="#6D95E1" />
<SortedDescendingCellStyle BackColor="#E9EBEF" />
<SortedDescendingHeaderStyle BackColor="#4870BE" />
</asp:GridView>
<asp:LinkButton ID="LinkButton1" runat="server"></asp:LinkButton>
</div>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$("[id*=GridView1] td").hover(function() {
$("td", $(this).closest("tr")).addClass("hover_row");
}, function() {
$("td", $(this).closest("tr")).removeClass("hover_row");
});
});
</script>
</form>
このコードでは、GridViewのホバーは機能しますが、オートコンプリートはありません!
を参照してください開発ツール:
$(document).ready()
ので、一度それを宣言するには、クリーナー/(source)優れています。 – Zakiは言う:TypeError例外:$(...)オートコンプリート機能ではありません jquery.min.js:2 v.Callbacks/c.fireWith() jquery.min.js:2 .ready() jqueryの.min.js:2 A() –
あなたには2つのバージョンのjQueryが含まれています。 2番目のインクルードは '$'オブジェクトを完全に上書きしますので、その後はjQuery UIは利用できなくなります。 –