JSONP回调中的PreventDefault答案

【问题标题】：PreventDefault inside JSONP callbackJSONP回调中的PreventDefault
【发布时间】：2012-01-13 03:13:48
【问题描述】：

我想在 jsonp 的回调中使用事件的 preventDefault 方法。我必须使用纯 JavaScript。我已经有一个模拟 jsonp 请求的函数。这是我在做什么：

var evt_temp = null;

function onContextMenu(event)
{    
    evt_temp = event;
    jsonp
    ({
        url: "someurl",
        params: "someparams",
        callback: "cb"
    });
}

function cb(response)
{
    if (something == true)
    {
        evt_temp.preventDefault();
        evt_temp = null;
    }
}

我的解决方案有效，但我觉得这不是一个好主意，将事件存储在 var 上。有人知道更好的方法吗？

【问题讨论】：

你的 jsonp API 太糟糕了，修复它，让它使用函数引用而不是函数名
您可能不知道 JSONP 是什么来发表这样的评论...发出 jsonp 请求的唯一方法是：url?callback=method。您必须将回调函数作为字符串发送。
我当然知道，但这是可以在 jsonp 函数中完成的魔法，为什么 jsonp 不能接受回调函数然后创建一个全局 uuid 将回调存储在那里然后执行 url?callback=globaluuid
好吧，我的问题是：这样做将如何解决我的问题？我的 jsonp api 很糟糕，但它可以工作。让它接受匿名函数不会解决我的问题。我无法将对象发送到 jsonp 请求，然后在回调函数上对其进行响应。如果可能的话，我从未见过。
查看答案。在引擎盖下做到这一点并不难

标签： javascript jsonp

【解决方案1】：

它没有什么反对它，但在你的情况下，它似乎有点没用。当您使用异步回调时，preventDefault() 将在默认浏览器行为发生后调用。只有在事件的回调函数中直接使用它才有意义。

【讨论】：

它不是没用的。我需要在站点中的某些链接上右键单击显示自定义菜单。当我右键单击一个链接（oncontextmenu 事件）时，我发送一个 jsonp 请求（因为它的跨域），并且我应该只在某些情况下显示我的自定义菜单（并停止 contextmenu 的事件）（根据 jsonp 响应）。否则我应该做正常的行为。对不起我的英语不好。

【解决方案2】：

function onContextMenu(event) {    
    evt_temp = event;
    good_jsonp({
        url: "someurl",
        params: "someparams",
        callback: function (response) {
            if (something === true) {
                event.preventDefault();
            }
        }
    });
}

var good_jsonp = (function () {
    var uuid = 0;
    return good_jsonp;

    function good_jsonp(obj) {
        var id = "good_jsonp" + ++uuid;
        window[id] = obj.callback;
        obj.callback = id;
        jsonp(obj);
    }
}());

【讨论】：

您的回答并不完整，但它给了我如何制作它的良好开端。谢谢。

【解决方案3】：

嗯，我就是这么弄的，以防有人需要某天：

var MyAPI =
{
    jsonp: function(args)
    {
        var script = document.createElement("script");
        var url = args.url + "?";
        var generatedFunction = "jsonpCallback" + Math.round(Math.random() * 1000001);

        window[generatedFunction] = function(response)
        {
            args.callback(eval("(" + response + ")"));
            delete window[generatedFunction];
            document.body.removeChild(document.getElementById(generatedFunction));
        };

        if (args.params)
        {
            url += "_r={";

            for (var prop in args.params)
            {
                url += "\"" + prop + "\":\"" + args.params[prop] + "\",";
            }

            url = url.substr(0, url.length - 1);
            url += "}&"
        }

        url += "_cb=" + generatedFunction;

        script.src = url;
        script.type = "text/javascript";
        script.id = generatedFunction;

        document.body.appendChild(script);
    }
};

调用它：

MyAPI.jsonp
({
    url: "someurl",
    params: { param1: "param1", param2: "param2" },
    callback: function(response)
    {
        alert(response);
    }
});

【讨论】：