1

我正在使用 filamentgroup JQuery 选择菜单小部件。小部件在页面的头部部分初始化。当页面第一次加载 Jquery 成功加载小部件但在 ajax 调用（使用 POST 提交表单）之后，选择菜单小部件停止工作（未初始化）。我使用输入文本字段在输入键时提交表单时遇到了同样的问题，但后来我使用委托方法将事件处理程序附加到选定元素。它奏效了。所以我的问题是：如何在 AJAX 调用后重新初始化选择菜单。也许我可以使用相同的委托方法进行初始化。我用谷歌搜索但没有找到任何初始化小部件的 JQuery 事件。这是代码片段

<head>
<script type="text/javascript">
$(document).ready(function() 
{
    $('select').selectmenu
        ({
            width: 70,
            style: 'dropdown',
            menuWidth: 100,
            maxHeight: 400,
            change: function() 
                {
                    $(this).parents('form').submit();
                }
        });

    $('body').delegate('.submit', 'keydown', function(e)
        {
            if (e.keyCode == 13) 
                {
                    $(this).parents('form').submit();
                    return false;
                }
        });

    $('#regFormID').submit(function()
        {
            $.ajax(
                {
                    type: 'POST',
                    url: 'index.php',
                    data: $(this).serialize(),
                    error: function(xml, status, error) 
                    {
                        $('#dataFilterID').html('<p><strong>Error Code:</strong> '+status+'</p><p><strong>Explanation:</strong> '+error+'</p>');
                    },
                    success: function(data, textStatus, jqXHR)  
                    {
                        $('#dataTableID').html($(data).find('#dataFilterID').html());                                                                   
                    }                                                                                   
                });
            return false;
        }   
});
</script>         
</head>

<body>
<div id="#dataFilterID">
<form id="regFormID" class="reg-form" name="regForm" method="POST" action="">
    <select class="select" id="Filter-dbPage-count" name="Filter-dbPage-count">
    <option selected="selected" value="30">30</option>
    <option value="50">50</option>
    <option value="100">100</option>
    <option value="150">150</option>
    <option value="200">200</option>
    </select>
<input type="text" value="" class="submit " id="Filter-dbField-1" name="Filter-dbField-1">
<input type="text" value="" class="submit " id="Filter-dbField-2" name="Filter-dbField-2">
<input type="text" value="" class="submit " id="Filter-dbField-3" name="Filter-dbField-3">
</form>
</div>    
</body>
4

1 回答 1

0

在成功回调中重新绑定

   success: function(data, textStatus, jqXHR)  
    {
    $('#dataTableID').html($(data).find('#dataFilterID').html());  
    $('select').selectmenu
            ({
                width: 70,
                style: 'dropdown',
                menuWidth: 100,
                maxHeight: 400,
                change: function() 
                    {
                        $("select").parents('form').submit();
                    }
            });                                                                     
          }
于 2012-03-12T09:19:20.390 回答