0

I've made a function with an ajax post. This function is in an external js file on my server. (functions.js).

From another page I call the function like this:

 $('table.table_sort td').click(function(e)
    {
        var url = "https://<?=$_conf['siteurl']?>/files/process.ajax.php";
        sortTable(url, e);
    });

The function in the functions.js looks like this:

    function sortTable(url, e)
{
    if( !$(e.target).is(".last, .last input")){

        $('input[name="sort"]').parent('td').removeClass('sort_active');


        $('input[name="sort"]').parents('td').children('div').removeClass().addClass('sort_none');

        if($(this).children('input[type="radio"]:first').is(':checked'))
        {
            $(this).children('input[type="radio"]:last').prop('checked', true);
            $(this).children('div').removeClass().addClass('sort_asc');
            $('input[name="sort"]:checked').parent('td').addClass('sort_active');
        }
        else
        {
            $(this).children('input[type="radio"]:first').prop('checked', true);
            $(this).children('div').removeClass().addClass('sort_desc');
            $('input[name="sort"]:checked').parent('td').addClass('sort_active');
        }

        $.ajax({
            type: "POST",
            url: url,
            async: false,
            data: $('#myform').serialize(),
            complete: function(data)
            {
                $('#results').html(data.responseText);

            }
        });
    }
}

Unfortunately nothing happened. When I do this it work:

$('table.table_sort td').click(function(e)
        {
            var url = "https://<?=$_conf['siteurl']?>/files/process.ajax.php";

            if( !$(e.target).is(".last, .last input")){

                $('input[name="sort"]').parent('td').removeClass('sort_active');


                $('input[name="sort"]').parents('td').children('div').removeClass().addClass('sort_none');

                if($(this).children('input[type="radio"]:first').is(':checked'))
                {
                    $(this).children('input[type="radio"]:last').prop('checked', true);
                    $(this).children('div').removeClass().addClass('sort_asc');
                    $('input[name="sort"]:checked').parent('td').addClass('sort_active');
                }
                else
                {
                    $(this).children('input[type="radio"]:first').prop('checked', true);
                    $(this).children('div').removeClass().addClass('sort_desc');
                    $('input[name="sort"]:checked').parent('td').addClass('sort_active');
                }

                $.ajax({
                    type: "POST",
                    url: url,
                    async: false,
                    data: $('#myform').serialize(),
                    complete: function(data)
                    {
                        $('#results').html(data.responseText);

                    }
                });
            }
        });

Any ideas?

4

1 回答 1

0

你的问题是this函数内部的使用。您需要将其传递给函数，因为函数this内部不会返回单击的元素...

$('table.table_sort td').click(function(e) {
    var url = "https://<?=$_conf['siteurl']?>/files/process.ajax.php";
    sortTable(this, url, e);
});

function sortTable(el, url, e)
{
    var $el = $(el);

    if( !$(e.target).is(".last, .last input")){

        $('input[name="sort"]').parent('td').removeClass('sort_active');
        $('input[name="sort"]').parents('td').children('div').removeClass().addClass('sort_none');

        if($el.children('input[type="radio"]:first').is(':checked'))
        {
            $el.children('input[type="radio"]:last').prop('checked', true);
            $el.children('div').removeClass().addClass('sort_asc');
            $('input[name="sort"]:checked').parent('td').addClass('sort_active');
        }
        else
        {
            $el.children('input[type="radio"]:first').prop('checked', true);
            $el.children('div').removeClass().addClass('sort_desc');
            $('input[name="sort"]:checked').parent('td').addClass('sort_active');
        }

        $.ajax({
            type: "POST",
            url: url,
            async: false,
            data: $('#myform').serialize(),
            complete: function(data)
            {
                $('#results').html(data.responseText);
            }
        });
    }
}

您现在应该能够将函数放回外部文件中，正如您最初想要的那样:)

于 2013-09-17T10:28:59.160 回答