Question

我被困在这一个上面。我认为这应该很简单，但我没有成功。我只是想在href标签中将变量发布到单独文件上的php函数中。我试图用成功的警告框来测试我的JS。我没有得到警告框，“成功警报框测试！”。

知道我做错了什么吗？我猜测问题在于我的成功功能。

再次感谢！非常感谢。

HTML：

<a href="#" class="target" data-review="1">Click here</a>

JS：

$(document).ready(function() {
    $( ".target" ).click(function(e) {
        e.preventDefault();
        var review_id = this.data('review');
        $.ajax({
            url : "vote_add.php",
            type : "POST",
            dataType: "json",  
            data : {
                reviewId : review_id
            },
            success : function(data) {
                if (data == 'success')  {
                    alert('Success alert box test!');
                } else {
                    alert(data);    
                }
            }
        });
    });
});

Vote_add.php：

<?php

echo "success";


?>

Answer 1

$(document).ready(function() {
$( ".target" ).click(function(e) {
        e.preventDefault();

        var review_id = $(this).data('review');
        $.ajax({
            url : "/echo/json/",
            type : "POST",
            dataType: "json",  
            data : {
                reviewId : review_id
            },
            success : function(data, status) {
                if (status == 'success')  {
                    alert('Success alert box test!');
                } else {
                    alert(data);    
                }
            }

            });

});
});

第5行this上的错误应该是$(this) - jQuery对象，您还应该使用success的{{1}}的第二个参数。

为了便于调试，只需使用FireBug或DevTools。

Answer 2

有些事情需要改进你的代码和我的经验，我认为你应该改变：

$(this).data('review')应该有用。

.data()方法允许我们以一种不受循环引用和内存泄漏的方式将任何类型的数据附加到DOM元素。

从jQuery 1.6开始，.prop()方法提供了一种显式检索属性值的方法，而.attr（）则检索属性。

您提供的$.ajax()选项上的回调函数应该类似于.done()，.fail()，.always()和.then()

从jQuery 1.5开始，$.ajax()返回的jqXHR对象实现了Promise接口，为它们提供了Promise的所有属性，方法和行为。

弃用通知： 自jQuery 1.8起，不推荐使用jqXHR.success（），jqXHR.error（）和jqXHR.complete（）回调。

根据您的Web服务的设置方式，您应该能够在服务器代码中设置断点（我假设您可以访问它或自己构建它？）。如果不可能，请使用Firebug或任何其他开发人员工具栏检查data返回的.fail()对象，然后查找xhr.statusText或xhr[0].statusText（同样，具体取决于您的网络服务如何返回它）。

成功： 类型：功能（PlainObject数据，String textStatus，jqXHR jqXHR）如果请求成功则调用的函数。该函数传递三个参数：从服务器返回的数据，根据dataType参数格式化;描述状态的字符串;和jqXHR（在jQuery 1.4.x，XMLHttpRequest中）对象。

jqXHR.done（function（data，textStatus，jqXHR）{}）; 成功回调选项的替代构造，.done（）方法替换了不推荐使用的jqXHR.success（）方法。

如果您正在使用＆＃34; POST＆＃34;您可能希望将其作为JSON字符串发送到Web服务。 JSON.stringify()可以为此提供帮助。缺少一些浏览器支持，但您可以使用polyfill
最后但并非最不重要的是，如果您要发送json，您希望json回来。我<? echo "success" ?>不会削减它我害怕。查看this post以了解我的意思。

json类型将获取的数据文件解析为JavaScript对象，并将构造的对象作为结果数据返回。为此，它在浏览器支持时使用jQuery.parseJSON（）;否则它使用Function构造函数。格式错误的JSON数据将引发解析错误（有关更多信息，请参阅json.org）。 JSON数据便于以简洁易懂的方式传递结构化数据，以便JavaScript进行解析。如果获取的数据文件存在于远程服务器上，请改为指定jsonp类型。

$(function () {
    var ajaxOptions = {
        url: "vote_add.php",
        type: "POST",
        dataType: "json"
    };

    $(".target").click(function (e) {
        var options,
            optionsData = {
                reviewId: $(this).data('review')
        };

        e.preventDefault();

        //options = $.extend({}, ajaxOptions, { data: optionsData });
        options = $.extend({}, ajaxOptions, { data: JSON.stringify(optionsData) });

        $.ajax(options).done(function (data) {
            // success so use your data object
            // are you looking for a property?
            var myProperty = 'myProperty';
            if (data.hasOwnProperty(myProperty)){
                var myValue = data[myProperty];
            }
        }).fail(function (xhr) {
            // do something on error
            console.warn("myscript.js > " + xhr.statusText + ' ' + xhr.status);
        }).always(function() {
            // do something no matter what happens
        });
    });
});

JS Post to Php Issue

2 个答案: