0

如果用户将鼠标移到表格单元格上,则下拉框将 html 替换为通过 post 调用加载的数据。如果用户的鼠标移动不是太快,这很好用,但如果太快,html 不会更新,因此当用户将鼠标移回 html 时,它是不正确的。

$(".edit_dropdown").bind('mouseenter', function () {
$(this).unbind('mouseenter');
var a = $.trim($(this).html());
var id = $(this).attr('id');

$(this).html("<span id='s-" + id + "'></span>");
$.post('save/dropdown.php', {
    id: id,
    a: a
}, function (data) {
    $("#s-" + id).html(data);

    $(".edit_dropdown").bind('mouseleave', function () {
        var id = $(this).attr('id');
        var a = $("#e-" + id).val();
        var dir = $(this).attr('class');
        $(this).html(a);
        $(this).bind('mouseenter', function () {
            $(this).unbind('mouseenter');
            var a = $.trim($(this).html());
            var id = $(this).attr('id');
            $(this).html("<span id='s-" + id + "'></span>");
            $.post('save/dropdown.php', {
                id: id,
                a: a
            }, function (data) {
                $("#s-" + id).html(data);
            });
        });

    });
});
}); 

html

<tr>
<td>customer county</td>
<td class="edit_dropdown" id="customer-cust_s_county"><?php echo $row['cust_s_county']; ?></td>
</tr>

$.post 文件返回英国县的列表,如果县名与 html 匹配,则返回该县作为选定选项。

4

1 回答 1

0

出现此问题的原因是 mouseleave 处理程序仅用于响应对 mouseenter 处理程序的异步响应。

您应该寻找不涉及分离和重新附加处理程序的更简单的整体代码结构。

应该可以编写两个永久连接的处理程序,如下所示:

$(".edit_dropdown").on('mouseenter', function () {
    //Perform all mouseenter actions here.
    //If necessary, test for different states and branch as required.
}).on('mouseleave', function () {
    //Perform all mouseleave actions here.
    //If necessary, test for different states and branch as required.
});

另一点:由于县列表是静态的,您可以将其作为页面原始 HTML 的一部分提供一次。然后,您只需要返回要选择的县的名称或 ID,而不是重复返回整个列表。

于 2012-12-15T15:53:38.123 回答