0

私は を持ってい<table id="pickups">ます/pages/home.php。他のページが設定されていない場合、デフォルトでindex.php含まれます。そのテーブルの特定の列にある要素 ( logfilehome.php )をクリックすると、テーブルを含むコンテナーが特定のサイズになり、新しいコンテンツがコンテナーに読み込まれ、コンテナーのすぐ下にフェードインします。.main#pickups.animate().pickup.main

今、私は直接リンクをサポートしたいので、 website.tld/?pickup=nameにリンクする場合、-table の1 つのlogfile#pickups -elementanimate()をクリックしたときに -table が好きになるようにします。#pickups

ここで例を試すことができます：

  1. 通常のリンク (ログファイルをクリックする必要があります): fortress.pwnz.it
  2. 直接リンク (テーブルのログファイル列のログファイル$_GET['pickup']をクリックしたときと同じように、設定時にアニメーションが自動的に発生するようにしたい): fortress.pwnz.it/?pickup=CTFCL-20130816-0132-openfire_lowgrens

これが私がこれまでに得たものです：

jQuery、以下のコードは$(document).ready(function() { <scope> })スコープ内にあります。

    var mainIsCollapsed = 0;
    var mainLastHeight = 0;

    var $_GET = {};
    document.location.search.replace(/\??(?:([^=]+)=([^&]*)&?)/g, function() {
        function decode(s) {
            return decodeURIComponent(s.split("+").join(" "));
        }
        $_GET[decode(arguments[1])] = decode(arguments[2]);
    });
    //if direct link was clicked
    if($_GET['pickup'] != null) {
        var pickup = $_GET['pickup'];
        alert('var pickup: ' + pickup);
        loadPickup(pickup);
    }



    //if td element is clicked
    $('#pickups td:first-child').click(function() {
        loadPickup($(this).attr('name'));
    });


    //fade out content and animate 'main' to its normal size
    $('div.main').click(function() {
        if($(':animated').length)
            return false;
        if(mainIsCollapsed == 1) {
            $('div.pickup').fadeOut(250);

            $(this).animate({
                height: mainLastHeight
            }, 600, function() {
                mainIsCollapsed = 0;
            });
        }
    });




    //animate table and fade in content
    var loadPickup = function(pickup) {
        alert(pickup);

        if($(':animated').length)
                return false;

        if(mainIsCollapsed == 0) {
            mainLastHeight = $('div.main').height();

            //collapse main frame
            $('div.main').animate({
                height:'50px'                    
            }, 600, function() {
                mainIsCollapsed = 1;
            });
            //load content
            $('div.pickup').load('/pages/pickup.php?pickup=' + pickup, function() {
                //fade in
                $('div.pickup').fadeIn(300);
                //some other code here for tooltips and such
            });
    }

問題は、直接リンクを使用すると、関数loadPickup(pickup)が実行されないことです (alert(pickup)メッセージ ボックスがポップアップせず、すべての jQuery スクリプトが機能しなくなったように見えます)。

ファイル:

  1. index.php上記のjQuery/javascriptをロードします
  2. index.php含む/pages/home.php
  3. index.phpdiv.pickup新しいコンテンツがロードされた後に表示される
  4. /pages/pickup.phpロードされるコンテンツですdiv.pickup
  5. /pages/home.phpコンテナー (アニメーション化されるもの) を含み.main、そのコンテナー内に#pickupsテーブルが配置されます

編集

loadPickup('CTFCL-20130816-0132-openfire_lowgrens');関数で直接呼び出してみました$(document).ready()が、そこでも呼び出されません。代わりに、すべての jQuery が機能しなくなったように見えます。

私は何を間違っていますか？

4

1 に答える 1

0

この問題の解決策はかなり単純です。私は obj-c と Java でのプログラミングに慣れています。loadPickup()関数を一番上に移動すると機能し$(document).ready()ます。呼び出しの下で定義されている場合、jQuery は関数を実行しようとしているときに関数をまだ認識していません。

于 2013-08-16T17:22:39.470 に答える