jQuery - динамически загружать Gist для встраивания? - PullRequest
Новая
       8

jQuery - динамически загружать Gist для встраивания?

4 голосов
/ 06 февраля 2012

Я не уверен, где это искать.Я хочу создать раскрывающийся список, чтобы выбрать идентификатор Gist, а затем сгенерировать его (встроить) в элемент-заполнитель.

Ранее у меня были сгенерированные сценарии, но они были скрыты и просто отображались по rel ID.Но это чрезвычайно медленно с еще более чем тремя встраиваниями Gist.

Я пробовал getScript, но я думаю, что document.write в коде встраивания Gist просто не позволяетоно скользит.

Может ли кто-нибудь указать мне правильное направление?

Ответы [ 3 ]

7 голосов
/ 24 апреля 2013

Хотя это, возможно, был лучший ответ в то время, я считаю, что теперь есть лучший ответ.

Для данной сущности, например, https://gist.github.com/anonymous/5446951,, вы можете получить доступ к объекту JSON, содержащему HTMLразметка и CSS URI для Gist на https://gist.github.com/anonymous/5446989.json - это выглядит примерно так: 

{
    "description": ...,
    "public":true,
    ...
    "div": <HTML code>,
    "stylesheet": <URI of CSS file>
}

На самом деле, вы можете получить эти данные в виде JSONP: https://gist.github.com/anonymous/5446989.json?callback=callback12345

Так, чтобы динамически загрузить Gist без iframe : 

function loadGist(element, gistId) {
    var callbackName = "gist_callback";
    window[callbackName] = function (gistData) {
        delete window[callbackName];
        var html = '<link rel="stylesheet" href="' + escapeHtml(gistData.stylesheet) + '"></link>';
        html += gistData.div;
        element.innerHTML = html;
        script.parentNode.removeChild(script);
    };
    var script = document.createElement("script");
    script.setAttribute("src", "https://gist.github.com/" + gistId + ".json?callback=" + callbackName);
    document.body.appendChild(script);
}
7 голосов
/ 06 февраля 2012

Проблема здесь в том, что document.write, используемый Gist для встраивания JavaScript, не выполняется после загрузки страницы.Чтобы обойти это, создайте iframe, установите его тело в JS embed JS, и установите событие onload, чтобы сообщить родителю, что нужно соответственно изменить размер iframe.Вот мое решение: https://gist.github.com/1748966

0 голосов
/ 06 февраля 2012

Я никогда не пробовал этого, но вот несколько примеров использования JSONP:

Можете ли выпопробуйте их и посмотрите, работают ли они у вас?

Если вы хотите пройти через PHP, вы можете посмотреть на это:

, а затем получить к нему доступ через обычные вызовы jQuery AJAX.

...