0

OK、エラー メッセージが表示され続け、どの div もドラッグできません...

エラーメッセージは次のとおりです。

キャッチされない例外: TypeError: '$(".polaroidpolaroid_attachments_mod_25").draggable' は関数ではありませんhttp://developers.dream-portal.net/test/index.phpの 343 行目、列 4 の ($) でエラーがスローされます: $(".polaroidpolaroid_attachments_mod_25").draggable({ http://ajax.googleapis.com/ajax/libs/jquery/1/の (t) の 2 行目、列 33900 から Function.prototype.apply() 経由で呼び出されます jquery.min.js : if(a[u].apply(t[0],t[1])===!1&&e.stopOnFalse) は、 http://ajax. googleapis.com/ajax/libs/jquery/1/jquery.min.js: (関数 r(t){v.each(t,関数(t,n){var i=v.type(n);i==="関数"?(!e.unique||!c.has (n))&&a.push(n):n&&n.length&&i!=="文字列"&&r(n)})})(引数),i?o=a.length:n&&(s=t,l(n) ) http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.jsの (e) の行 2、列 22488 から呼び出されます: v.ready.promise().done(e)を返します、これはhttp://developers.dream-portal.net/test/index.phpの startPolaroids() の行 276、列 3 から呼び出され ます: jQuery(document).ready(function($){ 行 1322、列から呼び出されます5 http://developers.dream-portal.net/test/Themes/default/scripts/script.js?fin20の () 内: aOnloadEventsi;

次の関数を使用して Web ページのヘッドにロードされる外部 js ファイルを使用しています。

var aOnloadEvents = new Array();
function addLoadEvent(fNewOnload)
{
    // If there's no event set, just set this one
    if (typeof(fNewOnload) == 'function' && (!('onload' in window) || typeof(window.onload) != 'function'))
        window.onload = fNewOnload;

    // If there's just one event, setup the array.
    else if (aOnloadEvents.length == 0)
    {
        aOnloadEvents[0] = window.onload;
        aOnloadEvents[1] = fNewOnload;
        window.onload = function() {
            for (var i = 0, n = aOnloadEvents.length; i < n; i++)
            {
                if (typeof(aOnloadEvents[i]) == 'function')
                    aOnloadEvents[i]();
                else if (typeof(aOnloadEvents[i]) == 'string')
                    eval(aOnloadEvents[i]);
            }
        }
    }

    // This isn't the first event function, add it to the list.
    else
        aOnloadEvents[aOnloadEvents.length] = fNewOnload;
}

そして、Web ページの本文 (それを実行するスクリプトからアクセスできるのはこれだけです) には、PHP で次のコードを記述しています (引用符のエスケープはご容赦ください)。

// Only want to load up jQuery 1 time here!
if(!window.jQuery)
{
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.async = true;
   script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
   var oScripts = document.getElementsByTagName("script");
   var s = oScripts[0];
   s.parentNode.insertBefore(script, s);
}

if(!jQuery.ui)
{
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.async = true;
   script.src = "//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js";
   var oScripts = document.getElementsByTagName("script");
   var s = oScripts[0];
   s.parentNode.insertBefore(script, s);
}

function randomNum_polaroid_attachments_mod_25(minVal, maxVal)
{
    var randVal = minVal + (Math.random() * (maxVal - minVal + 1));
    return Math.round(randVal);
}

function startPolaroids()
{
    jQuery(document).ready(function($){
        // Set up default values.
        var offsetStartX = 0;
        var offsetEndX = $(document).width() - $(".polaroidpolaroid_attachments_mod_25").width();
        var offsetStartY = 0;
        var offsetEndY = $(document).height() - $(".polaroidpolaroid_attachments_mod_25").height();
        var objContain = 'document';
            var objEle = document.getElementById("placeholder");
            if (objEle)
            {

                var getObjOffset = $("#placeholder").position();

                offsetStartX = getObjOffset.left;
                offsetEndX = (offsetStartX + $("#placeholder").outerWidth(true)) - $(".polaroidpolaroid_attachments_mod_25").width();
                offsetStartY = getObjOffset.top;
                offsetEndY = (offsetStartY + $("#placeholder").outerHeight(true)) - $(".polaroidpolaroid_attachments_mod_25").height();

                if (offsetEndY < offsetStartY)
                    offsetEndY = offsetStartY + 1;

                if (offsetEndX < offsetStartX)
                    offsetEndX = offsetStartX + 1;
                objContain = '#placeholder';
            }

        // When everything has loaded, place all polaroids on a random position relative to document or element id!
        $(".polaroidpolaroid_attachments_mod_25").each(function (i) {
            var tempVal = Math.round(Math.random());
            if(tempVal == 1) {
                var rotDegrees = randomNum_polaroid_attachments_mod_25(330, 360); // rotate left
            } else {
                var rotDegrees = randomNum_polaroid_attachments_mod_25(0, 30); // rotate right
            }

            var cssObj = { 'left' : randomNum_polaroid_attachments_mod_25(offsetStartX, offsetEndX),
                'top' : randomNum_polaroid_attachments_mod_25(offsetStartY, offsetEndY),
                msTransform: 'rotate('+ rotDegrees + 'deg)', // IE 9
                '-moz-transform' : 'rotate('+ rotDegrees + 'deg)',  // Firefox
                '-webkit-transform' : 'rotate('+ rotDegrees + 'deg)',  // Safari & Chrome
                '-o-transform' : 'rotate('+ rotDegrees + 'deg)', // Opera
                'transform' : 'rotate\('+ rotDegrees + 'deg)' }; // added in case CSS3 is standard
            $(this).css(cssObj);
        });

        // Set the Z-Index (used to display images on top while dragging)
        var zindexnr = 1;

        // boolean to check if the user is dragging
        var dragging = false;

        // Show the polaroid on top when clicked on
        $(".polaroidpolaroid_attachments_mod_25").mouseup(function(e){
            if(!dragging) {
                // Bring polaroid to the foreground
                zindexnr++;
                var cssObj = { 'z-index' : zindexnr,
                'transform' : 'rotate(0deg)',           // added in case CSS3 is standard
                '-webkit-transform' : 'rotate(0deg)',   // Chrome and Safari
                msTransform: 'rotate(0deg)', // IE 9
                '-moz-transform' : 'rotate(0deg)',      // Firefox
                '-o-transform' : 'rotate(0deg)' };      // Opera
                $(this).css(cssObj);
            }
        });

        // Make the polaroid draggable & display a shadow when dragging
        $(".polaroidpolaroid_attachments_mod_25").draggable({
            cursor: 'pointer',
            containment: objContain,
            start: function(event, ui) {
                dragging = true;
                zindexnr++;
                var cssObj = { 'box-shadow' : '#888 5px 10px 10px', // added in case CSS3 is standard
                    '-ms-box-shadow' : '#888 5px 10px 10px', // IE 9
                    '-o-box-shadow' : '#888 5px 10px 10px',  // Opera
                    '-moz-box-shadow' : '#888 5px 10px 10px', // firefox 3.5 - 4.0
                    '-webkit-box-shadow' : '#888 5px 10px 10px', // Chrome & Safari
                    'margin-left' : '-10px',
                    'margin-top' : '-10px',
                    'z-index' : zindexnr };
                $(this).css(cssObj);
            },
            stop: function(event, ui) {
                var tempVal = Math.round(Math.random());
                if(tempVal == 1) {
                    var rotDegrees = randomNum_polaroid_attachments_mod_25(330, 360); // rotate left
                } else {
                    var rotDegrees = randomNum_polaroid_attachments_mod_25(0, 30); // rotate right
                }
                var cssObj = { 'box-shadow' : '', // added in case CSS3 is standard
                    '-ms-box-shadow' : '', // IE 9
                    '-o-box-shadow' : '',  // Opera
                    '-moz-box-shadow' : '', // firefox 3.5 - 4.0
                    '-webkit-box-shadow' : '', // Chrome & Safari
                    'transform' : 'rotate('+ rotDegrees + 'deg)', // added in case CSS3 is standard
                    '-webkit-transform' : 'rotate('+ rotDegrees + 'deg)', // Chrome & Safari
                    msTransform: 'rotate('+ rotDegrees + 'deg)', // IE 9
                    '-moz-transform' : 'rotate('+ rotDegrees + 'deg)',  // Firefox
                    '-o-transform' : 'rotate('+ rotDegrees + 'deg)', // Opera
                    'margin-left' : '0px',
                    'margin-top' : '0px' };
                $(this).css(cssObj);
                dragging = false;
            }
        });
    })
}
        // Calling SMF js function, defined in script.js, here.
        addLoadEvent(startPolaroids);

div をドラッグできず、HTML に存在します。上記のエラーが発生しているため、ここで正確な問題を特定しようとすると、これに別の目を使うことができます.

役立つ場合は、実際のページへのリンクもここにあります: http://developers.dream-portal.net/test/index.php

みんなありがとう ：）

したがって、これを変更すると：

// Only want to load up jQuery 1 time here!
if(!window.jQuery)
{
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.async = true;
   script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
   var oScripts = document.getElementsByTagName("script");
   var s = oScripts[0];
   s.parentNode.insertBefore(script, s);
}

if(!jQuery.ui)
{
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.async = true;
   script.src = "//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js";
   var oScripts = document.getElementsByTagName("script");
   var s = oScripts[0];
   s.parentNode.insertBefore(script, s);
}

これに：

if(!window.jQuery)
{
   var script = document.createElement("script");
   var uiScript = document.createElement("script");
   script.type = "text/javascript";
   uiScript.type = "text/javascript";
   script.async = false;
   uiScript.async = false;
   script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
   uiScript.src = "//ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js";
   var oScripts = document.getElementsByTagName("script");
   var s = oScripts[0];

   s.parentNode.insertBefore(script, s);
   s.parentNode.insertBefore(uiScript, s);
}

jQueryが存在し、jQuery UIがまだページにない場合、コードはjQuery UIを配置しません。そして、どうすれば正確にそれを行うことができますか? 他のソフトウェアもページを操作し、jQuery をページに追加している可能性があります。これをどのようにコーディングすればよいですか？その要素の前に挿入するために oScripts[0] を使用できないと考えています... jQuery がどこから呼び出されているのか本当にわからないため、それが存在するだけです...

4

2 に答える 2

4

jQueryUIが読み込まれていないようです。スクリプト：

if(!jQuery.ui)
{
   // bla bla
}

jQueryが定義されていないため、エラーが発生しています。最初にjQueryが完全に読み込まれるのを待ってから、次の関数に進んでjQueryUIの可用性を確認する必要があると思います。スクリプトの同期実行を使用する必要があります。

if(!window.jQuery)
{
   var script = document.createElement("script");
   script.type = "text/javascript";
   script.async = false; // CHANGES
   script.src = "//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js";
   var oScripts = document.getElementsByTagName("script");
   var s = oScripts[0];
   s.parentNode.insertBefore(script, s);
}
于 2012-12-01T23:52:37.983 に答える