触发change()事件以刷新选择框会导致实时更改事件重新触发

时间:2013-02-26 13:12:39

标签: jquery events onchange

我正在做的很简单,所以我可能做错了。

我有一个简单的选择框作为表格的过滤器。我有一个按钮来重置过滤器。

$("#package").live('change', function()
{   
    filterPackage = $("#package").val();

    $.ajax({url: 'ajaxAllGroups.php?filterPackage='+filterPackage, cache: false, success: function(main)
    {
        $('#fullPartsList').html(main);
    }});
});

function unfilter()
{
    $.ajax({url: 'ajaxAllGroups.php?filterPackage=0', cache: false, success: function(main)
    {
        $('#fullPartsList').html(main); // Send ajax content to table

        $('#package').val(0); // Reset option to default
        $("#package").change(); // Force visual change to select box
    }});
}

正如您所看到的,重置按钮将选择选项设置为零,并且我在选择视觉上触发了change()函数,使更改应用于选择框。

这一切都有效,但只有视觉的更改会触发上面的实时更改功能,从而导致第二次不必要的ajax调用。

我想过用true / false变量做这个让它运行一次但是无法在正确的时间让变量设置为true / false,但是我确信有一种更简单的方法。

提前致谢。

2 个答案:

答案 0 :(得分:2)

为什么不在实时操作处理程序中添加一个简单的检查来排除值为0的调用。

if(filterPackage!=0)
{
    $.ajax({url: 'ajaxAllGroups.php?filterPackage='+filterPackage, cache: false, success: function(main)
    {
        $('#fullPartsList').html(main);
    }});
}

答案 1 :(得分:1)

$(document).on('change', '#package', function() {
    doFilter(this.value);
});

function doFilter(pkg) {
    $.ajax({
        url : 'ajaxAllGroups.php',
        data: {filterPackage: pkg}
    }).done(function(main) {
        $('#fullPartsList').html(main);
    });
}

function unfilter() {
    $('#package').val(0);
    doFilter(0);
}