Question

ListBox1有一个listitem：

<asp:ListItem Value="No.1">No.1</asp:listitem>

还有一个测试标签

<asp:Label ID="lblLabel" runat="server" Text="Label1" ></asp:Label>

现在我正在尝试使用Javascript（jQuery）测试当列表框留下选项卡或输入时是否选择了列表项目1，这是不起作用的。这个javascript（jQuery）代码可能有什么问题？

$("#ListBox1").focusout(function () {
    if ($("#ListBox1").SelectedItem.Text === "No.1") {
        // tried also if ($("#ListBox1").val() === "No.1") { 
        $("#lblLabel").Text = $("#ListBox1").SelectedItem.Text;
    }
});

Answer 1

最大的问题是服务器端的ASP.Net Form Control Ids在客户端呈现出完全不同的东西。你可以这样做：

$("#<%=ListBox1.ClientID%>").focusout(function() { ... });

在我看来，这真的非常难看，所以我更喜欢使用类。您可以像这样定义控件标记：

<asp:Label ID="lblLabel" CssClass="obj_lblLabel" runat="server" Text="Label1" ></asp:Label>

这将允许您使用类选择器在客户端识别您的控件：

$(".obj_lblLabel").focusout(function() { ... });

您不一定需要obj_前缀，但我个人使用它来表示该类未用于样式目的。

此外，jQuery有一个change()事件，比focusout()更适合使用。

最后，您应该避免使用有效的ASP.Net Forms开发。这是一个破碎的范例，业界正在迅速摆脱。 ASP.Net MVC更易于使用，甚至可以更好地将其整合到您现有的项目中。见这里：ASP.Net MVC alongside Web Forms

Answer 2

使用jQuery并使用focusout事件，这样可以使用滚动键保持列表框可滚动。

$('#ListBox1').focusout(function () {
            var data = $(this).val();
            if (data == "No.1") {
                //alert(data);
                $('#myModal').modal('toggle');
            }
            $("#ListBox1").focus();
        });

使用Javascript测试选定的asp Listbox项目

2 个答案: