Question

我用ajax帖子做了一个函数。此函数位于我服务器上的外部js文件中。（functions.js）。

从另一个页面我调用这个函数：

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

functions.js中的函数如下所示：

    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);

            }
        });
    }
}

不幸的是什么也没发生。当我这样做时，它起作用：

$('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);

                    }
                });
            }
        });

有什么想法吗？

Answer 1

您的问题是在函数中使用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);
            }
        });
    }
}

您现在应该能够将该功能放回到您最初想要的外部文件中：）

Ajax在外部js中发布功能

1 个答案: