Dinamik yükleme JavaScript Widget Şu

Question

niteliklerini ben aşağıdaki

<script src='http://domain.com/public/jsonp/widget.js' data-id='LFKkv' data-width='240'></script> 

ile size sayfasında bir yere yerleştirmek bir widget ben sayfa yüklendikten sonra dinamik, ben jQuery $.getScript denedi bu yük istiyorum var sefil başarısız olan aşağıdaki gibi: Çünkü farz veri nitelikler arası URL üzerinde boşluk

$.getScript("http://domain.com/public/jsonp/widget.js' data-id='LFKkv' data-width='240'", function(data){ ... }) 

.

ajax'i kullanabilirim ama jQuery ajax çağrısıyla veri niteliklerini nasıl geçeceğimi bilmiyorum? Yukarıdaki widget'ı veri nitelikleri bozulmadan dinamik olarak nasıl yüklerim?

DÜZENLEME: Benim Widget verilerini yakalar nasıl görebilirsiniz benim Widget yazısının ilgili parçalar dahil nitelikleri:

<script> 

    var scriptName = "widget.js"; 
    TGW = window.jQuery.noConflict(true); 

    var allScripts = document.getElementsByTagName('script'); 
    var targetScripts = []; 

    for (var i in allScripts) { 
     var name = allScripts[i].src 
     if(name && name.indexOf(scriptName) > 0) 
      targetScripts.push(allScripts[i]); 
    } 

    scriptTag = targetScripts[targetScripts.length - 1]; 

    // Getting the data attributes here 
    jScript = TGW(scriptTag); 
    id = jScript.data("id"); 
    widget_width = jScript.data("width"); 
    </script> 

Answer 1

, widget,js yükleyen bir "init" işleve options nesneyi geçirmeden deneyin

TGW = window.jQuery.noConflict(true); 
function initWidget (options) { 
    return TGW.ajax({ 
    url: url, 
    dataType: "script" 
    }) 
    .then(function(script) { 
    // if `TGW.widgetName()` requires several seconds to load, 
    // try adding adding `setTimeout` or `.delay` to wait 
    // until `TGW.widgetName` defined before returning `TGW.widgetName` 
    return options && TGW.widgetName 
      ? TGW.widgetName(options) 
      : TGW.widgetName(/* defaults?, are `id`, `width` required? */); 
    }); 
}; 

initWidget({"id":"LFKkv", "width":"240"}) 
.then(function(widget) { 
    console.log(widget) 
}); 

Answer 2

kullanın jQuery load()

$(window).load(function() { 
    $('<script/>').attr({ 
     'src': 'http://domain.com/public/jsonp/widget.js', 
     'data-id': 'LFKkv', 
     'data-width': '240' 
    }).appendTo('body') 
}); 

Answer 3

gibi sarın Can widget'ınızı bir işlev içinde ve bir olay dinleyicisi kullanıyor musunuz?

window.addEventListener('load', function() { 

    var allScripts = document.getElementsByTagName('script'); 
    var targetScripts = []; 

    for (var i = 0; i < allScripts.length; i++) { 
     var name = allScripts[i].src; 
     if (name && name.indexOf(scriptName) > 0) 
      targetScripts.push(allScripts[i]); 
    } 

    var scriptTag = targetScripts[targetScripts.length - 1]; 

    console.log(scriptTag.dataset.width); 

}); 

Answer 4

Tamam "init" fonksiyonunun success callback'inde en widget'ındaki options set yerine bu denemelisiniz:

$.getScript("http://domain.com/public/jsonp/widget.js?data-id=LFKkv&data-width=240", function(data){ ... }) 

Bu, bir URL'de parametreleri nasıl geçirirsiniz. ?'u koyar ve data=value&data2=value2'u yerleştirmeye başlarsınız ve doğru şekilde html kodlanmış olmalıdır.

Answer 5

function loadjscssfile(filename, filetype){ 
    if (filetype=="js"){ //if filename is a external JavaScript file 
     var fileref=document.createElement('script') 
     fileref.setAttribute("type","text/javascript") 
     fileref.setAttribute("src", filename) 
    } 
    else if (filetype=="css"){ //if filename is an external CSS file 
     var fileref=document.createElement("link") 
     fileref.setAttribute("rel", "stylesheet") 
     fileref.setAttribute("type", "text/css") 
     fileref.setAttribute("href", filename) 
    } 
    if (typeof fileref!="undefined") 
     document.getElementsByTagName("head")[0].appendChild(fileref) } loadjscssfile("myscript.js", "js") //dynamically load and add this .js file loadjscssfile("javascript.php", "js") //dynamically load "javascript.php" as a JavaScript file loadjscssfile("mystyle.css", "css") ////dynamically load and add this .css file