最近我正在开发asp.net应用程序，但我发现我的脚本无法运行，也不知道为什么我在小提琴中测试过。
我希望在文本框中任意关键字的用户键时过滤我的列表框。
我的列表框ID为＆＃34; ItemList＆＃34;。
我的文本框ID是＆＃34; txtSearchItem＆＃34;。
这是我的页面脚本：
<%@ Page Title="" Language="C#" MasterPageFile="~/Staff/Staff.Master" AutoEventWireup="true" CodeBehind="AddPackage.aspx.cs" Inherits="ExpressPrintingSystem.Staff.Owner.Package.AddPackage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript">
$(document.getElementById("<%=txtSearchItem.ClientID%>")).on("keyup", function () {
var search = this.value;
$("option", document.getElementById("<%= ItemList.ClientID %>")).show().filter(function () {
return $(this).text().toLowerCase().indexOf(search.toLowerCase()) < 0;
}).hide();
});
</script>
</asp:Content>
这里的ListBox位于表中：
<td><asp:TextBox ID="txtSearchItem" TextMode="Search" Width="200px" runat="server" ClientIDMode="Static"/><br />
<asp:ListBox ID="ItemList" runat="server" Width="200px" DataSourceID="sdsItem" ClientIDMode="static" DataTextField="ItemName" DataValueField="ItemID"></asp:ListBox>
<asp:SqlDataSource ID="sdsItem" runat="server" ConnectionString="<%$ ConnectionStrings:printDBServer %>" SelectCommand="SELECT [ItemID], [ItemName] FROM [Item] WHERE ([ItemID] LIKE '%' + @keyword + '%') OR ([ItemName] LIKE '%' + @keyword + '%')">
<SelectParameters>
<asp:ControlParameter ControlID="txtSearchItem" DefaultValue="I" Name="keyword" PropertyName="Text" />
</SelectParameters>
</asp:SqlDataSource>
</td>
我不确定错误发生在哪里。我希望当文本框中的关键字与用户输入的关键字不匹配时隐藏选项标记.ListBox与数据源链接，数据源将调出项目的所有记录。请帮帮我。
以下是我的完整代码：
<%@ Page Title="" Language="C#" MasterPageFile="~/Staff/Staff.Master" AutoEventWireup="true" CodeBehind="AddPackage.aspx.cs" Inherits="ExpressPrintingSystem.Staff.Owner.Package.AddPackage" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<script type="text/javascript">
$(document.getElementById("<%=txtSearchItem.ClientID%>")).on("keyup", function () {
var search = this.value;
$("option", document.getElementById("<%= ItemList.ClientID %>")).show().filter(function () {
return $(this).text().toLowerCase().indexOf(search.toLowerCase()) < 0;
}).hide();
});
</script>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="cphStaffContent" runat="server">
<h1>Add Package</h1>
<asp:Label ID="lblError" runat="server" ForeColor="Red" Text=""></asp:Label>
<table>
<tr>
<td><asp:Label ID="lblName" runat="server" Text="Name:"></asp:Label></td>
<td><asp:TextBox ID="txtName" runat="server"></asp:TextBox></td>
<td><asp:RequiredFieldValidator ID="rfvName" runat="server" ControlToValidate="txtName" ForeColor="Red" ErrorMessage="Please fill up the the Name field."></asp:RequiredFieldValidator></td>
</tr>
<tr>
<td><asp:Label ID="lblSupport" runat="server" Text="Support Files:"></asp:Label></td>
<td><asp:CheckBoxList ID="cblSupport" runat="server"></asp:CheckBoxList></td>
</tr>
<tr>
<td><asp:Label ID="lblType" runat="server" Text="Type of Package:"></asp:Label></td>
<td><asp:DropDownList ID="ddlType" runat="server" Height="17px" Width="128px"></asp:DropDownList></td>
</tr>
<tr>
<td><asp:Label ID="lblItems" runat="server" Text="Package's Items:"></asp:Label></td>
<td><asp:Table ID="tblPackageItems" runat="server" Width="100%">
<asp:TableRow>
<asp:TableCell>Item</asp:TableCell>
<asp:TableCell>Quantity</asp:TableCell>
</asp:TableRow>
</asp:Table> </td>
<td><asp:TextBox ID="txtSearchItem" TextMode="Search" Width="200px" runat="server" ClientIDMode="Static"/><br />
<asp:ListBox ID="ItemList" runat="server" Width="200px" DataSourceID="sdsItem" ClientIDMode="static" DataTextField="ItemName" DataValueField="ItemID"></asp:ListBox>
<asp:SqlDataSource ID="sdsItem" runat="server" ConnectionString="<%$ ConnectionStrings:printDBServer %>" SelectCommand="SELECT [ItemID], [ItemName] FROM [Item] WHERE ([ItemID] LIKE '%' + @keyword + '%') OR ([ItemName] LIKE '%' + @keyword + '%')">
<SelectParameters>
<asp:ControlParameter ControlID="txtSearchItem" DefaultValue="I" Name="keyword" PropertyName="Text" />
</SelectParameters>
</asp:SqlDataSource>
</td>
</tr>
<tr>
<td><asp:Label ID="lblEstPrice" runat="server" Text="Estimated Price (RM):"></asp:Label></td>
<td><asp:Label ID="lblEstimatedPrice" runat="server" Text="0"/></td>
</tr>
<tr>
<td><asp:Label ID="lblPrice" runat="server" Text="Package Price (RM):"></asp:Label></td>
<td><asp:TextBox ID="txtPrice" runat="server"></asp:TextBox></td>
</tr>
</table>
<asp:Button ID="btnSubmit" runat="server" Text="Add Package"/>
<asp:Button ID="btnCancel" runat="server" Text="Cancel"/>
</asp:Content>
这是我的母版页：
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Staff.master.cs" Inherits="ExpressPrintingSystem.Staff.Staff" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Staff Portal</title>
<link rel="stylesheet" href="~/styles/main.css" type="text/css" />
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<div id="page">
<form runat="server">
<div id="header">
<asp:SiteMapDataSource ID="SiteMapDataSourceForStaff" SiteMapProvider="StaffSiteMap" runat="server" ShowStartingNode="false" />
<div>
<a href="#" class="logo"><img src="<%=Page.ResolveUrl("~/Images/logo/long_logo.png")%>" alt=""/></a>
<ul id="navigation">
<li class="selected">
<a href="#">Home</a>
</li>
<asp:Repeater runat="server" ID="menu" DataSourceID="SiteMapDataSourceForStaff">
<ItemTemplate>
<li>
<asp:HyperLink runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
<asp:Repeater runat="server" DataSource='<%# ((SiteMapNode) Container.DataItem).ChildNodes %>'>
<HeaderTemplate>
<ul>
</HeaderTemplate>
<ItemTemplate>
<li>
<asp:HyperLink runat="server" NavigateUrl='<%# Eval("Url") %>'><%# Eval("Title") %></asp:HyperLink>
</li>
</ItemTemplate>
<FooterTemplate>
</ul>
</FooterTemplate>
</asp:Repeater>
</li>
</ItemTemplate>
</asp:Repeater>
<li style="float:right;">
<asp:HyperLink ID="userInfoControl" runat="server"/>
<ul id="userMenu" runat="server">
</ul>
</li> </ul>
</div>
</div>
<div id="content">
<div>
<asp:ContentPlaceHolder ID="cphStaffContent" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</form>
<footer id="footer">
<div class="footcontent">
<div>
<a href="#" class="logo"><img src="<%=Page.ResolveUrl("~/Images/logo/long_logo.png")%>" alt=""/></a>
<ul>
<li><a href="#">Services</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>
</div>
<div class="footnote">
<div>
<p>© 2017 BY Express Printing System | ALL RIGHTS RESERVED</p>
</div>
</div>
</footer>
</div>
</body>
</html>
答案 0 :(得分：1)
当jQuery和其他库之间存在冲突时，通常会遇到此类问题。为了避免麻烦，请致电$.noConflict()，不要忘记在文档准备好后运行jQuery代码
$.noConflict();
jQuery(document).ready(function($){ /**/});
答案 1 :(得分：0)
首先创建一个JavaScript文件而不是script标记，然后像这样在母版页中链接该文件：
<script src="<%=ResolveClientUrl("~/content/assets/vendor/jquery/dist/jquery.min.js")%>">
</script>