Question

我需要触发＆＃39; blur（）＆＃39; asp的事件：ListBox。我正在使用为此控件选择的jquery插件。一旦触发模糊事件，我使用ajax来调用服务器端方法。这是我对ListBox的标记：

<asp:Panel ID="pnlTo" runat="server" CssClass="basicRow" ClientIDMode="Static">
        <asp:Label ID="lblTo" runat="server"  CssClass="labelText" Text="To: " 
            ClientIDMode="Static"></asp:Label>        
        <asp:ListBox ID="lstBoxTo" runat="server" SelectionMode="Multiple" 
                    data-placeholder="Choose recipient(s)…" multiple="true" class="chosen-select">
        </asp:ListBox>
        <asp:HiddenField ID="hdnRecipientAttr" runat="server" ClientIDMode="Static" />
    </asp:Panel>

这是javascript：除触发模糊事件外，所有javascript都有效。

 $(document).ready(function () {

        //Create groups for recipient dropdown list
        $(".chosen-select option[grouping='GlobalGroups']").wrapAll("<optgroup label='Global Groups'>");
        $(".chosen-select option[grouping='PersonalGroups']").wrapAll("<optgroup label='Personal Groups'>");
        $(".chosen-select option[grouping='Individuals']").wrapAll("<optgroup label='Individuals'>");

        //Configure the ListBox using the 'chosen' jquery plugin
        $(".chosen-select").chosen({
            search_contains: true,
            no_results_text: "Sorry, no match!",
            allow_single_deselect: true
        });
        $('.chosen-container').css('width', '600px');

        $(".chosen-single").chosen({
            search_contains: true,
            no_results_text: "Sorry, no match!"
        });

        //set hidden field with selected list
        $(".chosen-select").chosen().change(function (evt) {
            $("#hdnRecipientAttr").val("");
            $(".chosen-select").find("option:selected").each(function () {
                var label = $(this).closest('optgroup').prop('label');
                var currentHdnValue = $("#hdnRecipientAttr").val();

                if (label == "Individuals") {
                    var attrText = "Individuals-" + $(this).prop('value') + ";";
                    $("#hdnRecipientAttr").val(currentHdnValue + attrText);
                }
                else {
                    var attrText = "Group-" + $(this).prop('value') + ";";
                    $("#hdnRecipientAttr").val(currentHdnValue + attrText);
                }
            });
            //remove ending semicolon
            var hdnValue = $("#hdnRecipientAttr").val();
            $("#hdnRecipientAttr").val(hdnValue.slice(0, -1));
        });

        $("#lstBoxTo").blur(function () {
            alert("in onblur function");
            $.ajax({
                type: "POST",
                url: "Default.aspx/GetMaxMsgLength",
                data: '{selectedRecipients: "#hdnRecipientAttr"}',
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                success: OnSuccess,
                failure: OnFailure
            });
        });
    });

OnSuccess和OnFailure函数稍后定义。现在，我只想看到显示我处于模糊功能的警报。

这是从AJAX调用的代码隐藏：

public static string GetMaxMsgLength(string strRecipientList)
    {
        string tstrMaxMsgLength = string.Empty;
        PagingService.EmailInfo EmailInfo = new PagingService.EmailInfo();
        List<int> tlstIndividualIDs = new List<int>();
        List<int> tlstGroupIDs = new List<int>();
        string[] tstrSelectedList = strRecipientList.Split(';');
        foreach (string recipientID in tstrSelectedList)
        {
            if (recipientID.Contains(INDIVIDUAL_GROUP))
            {
                tlstIndividualIDs.Add(Convert.ToInt32(recipientID.Substring(recipientID.IndexOf('-') + 1)));
            }
            else //it's a groupID
            {
                tlstGroupIDs.Add(Convert.ToInt32(recipientID.Substring(recipientID.IndexOf('-') + 1)));
            }
        }
        EmailInfo.IndividualIDs = tlstIndividualIDs.ToArray();
        EmailInfo.GroupIDs = tlstGroupIDs.ToArray();

        return tstrMaxMsgLength = "32";
    }

任何人都可以告诉我为什么模糊功能没有触发？感谢。

更新

我尝试使用该类来识别该函数，但它也不起作用：这是我的改变：

 $(".chosen-select").chosen().blur(function () {
            alert("in onblur function");
            $.ajax({
                type: "POST",
                url: "Default.aspx/GetMaxMsgLength",
                data: '{selectedRecipients: "#hdnRecipientAttr"}',
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                success: OnSuccess,
                failure: OnFailure
            });
        });

我试过没有＆＃39;选择（）＆＃39;但仍然没有成功。

更新

我尝试定义＆＃39; onblur＆＃39;标记中的事件并将其绑定在Page_Load中，但仍然没有运气。这是我试过的：标记：

 <asp:ListBox ID="lstBoxTo" runat="server" SelectionMode="Multiple" ClientIDMode="Static" onblur="ShowMaxMsgLength()"
                        data-placeholder="Choose recipient(s)…" multiple="true" class="chosen-select">
            </asp:ListBox>

Javascript（我在文档就绪函数中注释掉了blur函数并添加了这个函数：

function ShowMaxMsgLength() {
                        alert("in onblur function");
                        $.ajax({
                            type: "POST",
                            url: "Default.aspx/GetMaxMsgLength",
                            data: '{selectedRecipients: "#hdnRecipientAttr"}',
                            contentType: "application/json; charset=utf-8",
                            datatype: "json",
                            success: OnSuccess,
                            failure: OnFailure
                        });
    };

在Page_load方法的代码隐藏中，我添加了这个：

lstBoxTo.Attributes.Add（＆＃34; onblur＆＃34;，＆＃34; ShowMaxMsgLength（）＆＃34;）;

仍然没有运气......

更新这是关于ListBox不喜欢的东西。我将blur事件添加到它触发的Message TextBox中。使用这个：

onblur="ShowMaxMsgLength()"

在消息框中，当文本框失去焦点时显示警报。

更新它使用jquery选择的插件作为问题的ListBox。选择＆＃39; class-selected-select＆＃39;远离并将ListBox显示为普通的asp：ListBox控件，触发模糊功能现在，我只需要弄清楚如何/为什么选择＆＃39;不喜欢＆＃39; onblur＆＃39;功能...

Answer 1

您忘记在ClientIDMode="Static"上设置lstBoxTo，因此它不会生成带有您期望ID的HTML。在.aspx代码中，像这样定义控件：

<asp:ListBox ID="lstBoxTo" runat="server" ClientIDMode="Static" SelectionMode="Multiple" data-placeholder="Choose recipient(s)…" multiple="true" class="chosen-select">
</asp:ListBox>

Answer 2

我曾在上一个项目中使用过Chosen图书馆。在所选择的封面下将生成自己的标记并有效地隐藏原始列表框，仅使用它来“保持”＃34;选择。您可能想尝试捕获on blur事件。如果我没记错，Chosen将从原始DOM元素中复制原始类...

$('.chosen-select').on('blur', function() { ... });

Answer 3

正如Dave提到的那样，问题就在于此。但是，您也可以选择使用“类”作为选择器。

最后，您可能还会考虑在代码中添加事件并将其绑定到加载控件。

ddl.Attributes.Add("onblur", "YOUR_EVENT();");

那说我建议在大多数情况下使用课程。

Answer 4

我能够使用'.change'事件做我需要做的事。

jquery blur事件没有为asp：ListBox触发

4 个答案: