如何让 jquery 脚本 "chosen" 在 asp.net 中工作

Question

我有这个代码：

<script type="text/javascript" src="../Scripts/chosen.min.js" ></script>

[...]

<asp:ListBox class="chosen-select" ID="lbCategory" runat="server" AutoPostBack="true" DataSourceID="SqlDataSourceDropDownListCategory" 
SelectionMode="Multiple" Width="200px" DataTextField="Name" DataValueField="IdCategory"></asp:ListBox>

<script>
    $(".chosen-select").chosen();
</script>

我在我编写的路径中有 js，但脚本不起作用，我尝试搜索，但我发现的一切都没有解决它，请有人帮忙。

Answer 1

我认为的问题。

文件中没有chosen.min.js。有 chosen.jquery.min.js 和其他一些。
如果您使用选择的插件，AutoPostBack="true" 将不起作用，因为插件重新设计了原始控件现在被隐藏了。您还使用 SelectionMode="Multiple"，因此如果每次点击自动 post 后退，您将获得 post 后退，这不是网络的最佳体验。
您没有包含选择的 jQuery library 需要工作。
更喜欢 CssClass 而不是 class。两者都有效，但对于 asp.net 控件，CssClass 是避免错误的正确方法。

如何查找错误。通过右键单击页面打开浏览器调试工具，在打开的菜单 select Inspect 上，然后打开 Console 看看你有什么错误并从那里得到它。

参考

Chosen documentation
Chosen downloads

工作示例

我创建了一个最简单的示例并对其进行了测试并且有效。

<script src="https://code.jquery.com/jquery-3.6.0.min.js" integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4=" crossorigin="anonymous"></script>
<script type="text/javascript" src="/js/jQuery/Chosen/chosen.jquery.js " ></script>
<link rel="stylesheet" href="/js/jQuery/Chosen/chosen.css" />               

<asp:ListBox ID="lstCategoryType" runat="server" CssClass="chosen-select"  SelectionMode="Multiple" Width="200px">
    <asp:ListItem Text="Option 1" Value="1"></asp:ListItem>
    <asp:ListItem Text="Option 2" Value="2"></asp:ListItem>
    <asp:ListItem Text="Option 3" Value="3"></asp:ListItem>
    <asp:ListItem Text="Option 4" Value="4"></asp:ListItem>
</asp:ListBox>

<script>
    jQuery(document).ready(function(){
        jQuery(".chosen-select").chosen();    
    });
</script>

如何让 jquery 脚本 "chosen" 在 asp.net 中工作

How do I get the jquery script "chosen" to work in asp.net

javascript

asp.net

jquery-chosen

参考

工作示例