使用Ajax的自定义函数无法按预期工作

时间:2012-05-22 21:11:32

标签: php jquery ajax

我整天都在抨击这个问题。我缺乏对JavaScript的良好了解,对于DOM操作,我开始使用jQuery。构建一些基本的东西很容易。我想要的是构建自定义函数,该函数将填充表单,该列表将根据我传递给此函数的输入参数从数据库中拉出。

代码如下所示:

(function($) {
        $.fn.multiSelect = function(a,b,c) {
        var someVar1 = parseInt(a,10);
        var someVar2 = parseInt(b,10);
        var someVar3 = c;
        var dataString = "a=" + someVar1 + "&b=" + someVar2 + "&c=" + someVar3;
        $.ajax({
            type:       "POST",
            url:        "test_ajax.php",
            data:       dataString,
            dataType:   'json',
            success:    function(data) {
                var a1 = data['a'];
                var b1 = data['b'];
                var c1 = data['c'];
                return $(this).html('<p>' + a1 + b1 + c1 + '</p>');
            }
        });
        return $(this).html('<p>' + someVar1 + someVar2 + someVar3 + '</p>');
    }
    };
}) (jQuery);

test_ajax.php中的PHP代码是:

<?php
if(isset($_POST['a']) AND !empty($_POST['a'])) {
    $_something = array(
                    'a'=> $_POST['a'],
                    'b'=> $_POST['b'],
                    'c'=> $_POST['b']
                    );
    echo json_encode($_something);
}
?>

现在当我使用我的jQuery函数时:

$('#someDiv').multiSelect(1,1,'user');

在$。(ajax)中的函数,什么都不返回,在它之外(我创建的只是为了查看传入函数的内容)返回“11user”。

如果我使用上面这样的代码:

$(function() {
    var dataString = 'a=' + 1 + '&b=' + 1 + '&c=user';
    $.ajax({
            type:       "POST",
            url:        "test_ajax.php",
            data:       dataString,
            dataType:   'json',
            success:    function(data) {
                var a1 = data['a'];
                var b1 = data['b'];
                var c1 = data['c'];
                $('#someDiv').html('<p>' + a1 + b1 + c1 + '</p>');
            }
        });
});

它从test_ajax.php脚本中获取数据。所有这一切都很简单,只是为了解决问题,然后我将构建复杂的PHP脚本,这将完成数据库的工作。

我猜我在做变量(本地/全局)或不正确的jQuery函数链接时出错了。

编辑:由于我会在不同的菜单上多次重复此操作,因此功能会产生更多逻辑,然后反复重复整个代码。

任何帮助都将不胜感激。

1 个答案:

答案 0 :(得分:1)

我认为您所说的是$.ajax来电中的这一行不起作用:

return $(this).html('<p>' + a1 + b1 + c1 + '</p>');

这是因为this调用中success未指向DOM对象。它指向一个包含AJAX调用设置的对象。

您需要在AJAX调用中使用context属性,使this表示您想要的含义:

    $.ajax({
        type:       "POST",
        url:        "test_ajax.php",
        data:       dataString,
        dataType:   'json',
        context:    this,
        success:    function(data) {
            var a1 = data['a'];
            var b1 = data['b'];
            var c1 = data['c'];
            return $(this).html('<p>' + a1 + b1 + c1 + '</p>');
        }
    });