選擇選項沒有顯示

Question

我正在創建一個應用程序，其中頁面內容被更改並通過AJAX（和hashchange jQuery腳本）動態替換。出於某種原因，在動態更改的AJAX內容中，選擇表單選項沒有顯示出來。例如這裏：

http://socialbungy.com/newsite/sweeps_temp_facebook/TAB_TEMP1/#enter.php

但是，如果我運行頁面，沒有裝載/改變通過AJAX的內容（除去在URL中的＃標記），選擇表單元素的作品，因爲它是應該的。

http://socialbungy.com/newsite/sweeps_temp_facebook/TAB_TEMP1/enter.php

這是我的命！請幫忙。從來沒有遇到過這樣的問題。甚至不知道從哪裏開始。但這裏是我認爲的動態腳本是問題。雖然找不到與選擇框的任何衝突。是什麼賦予了？

$(function() { 

var newHash  = "", 
    $mainContent = $("#appContent"), 
    $pageWrap = $("#page-wrap"), 
    baseHeight = 0, 
    $el; 

$pageWrap.height($pageWrap.height()); 
baseHeight = $pageWrap.height() - $mainContent.height(); 

    $("nav").delegate("a", "click", function() { 
     window.location.hash = $(this).attr("href"); 
     return false; 
    }); 
    $("#buttonWrap").delegate("a", "click", function() { 
     window.location.hash = $(this).attr("href"); 
     return false; 
    }); 

$(window).bind('hashchange', function(){  
    newHash = window.location.hash.substring(1);   
    if (newHash) { 
     $mainContent 
      .find("#guts") 
      .slideToggle(500, function() { 
       $mainContent.hide().load(newHash + " #guts", function() { 
        $mainContent.slideToggle(500, function() { 
         $pageWrap.animate({ 
          height: baseHeight + $mainContent.height() + "px" 
         }); 
        }); 
        $("nav a").removeClass("current"); 
        $("nav a[href="+newHash+"]").addClass("current"); 

        //RE-FIRE OTHER SCRIPTS ON AJAX CONTENT LOAD 

        //Phone Field Format 
        $(function() { 
         $("#phone").mask("(999) 999-9999",{placeholder:" "}); 
        }); 

       }); 
      }); 
    };       
}); 

$(window).trigger('hashchange'); 

}）;

Answer 1

您的服務器響應看起來完全正確，但是在插入DOM之後，您的select元素都會變形。我的猜測是load（）+ parse-selector是罪魁禍首。與$.ajax試試吧，這樣的事情：

$(function() { 

var newHash  = "", 
    $mainContent = $("#appContent"), 
    $pageWrap = $("#page-wrap"), 
    baseHeight = 0, 
    $el; 

$pageWrap.height($pageWrap.height()); 
baseHeight = $pageWrap.height() - $mainContent.height(); 

    $("nav").delegate("a", "click", function() { 
     window.location.hash = $(this).attr("href"); 
     return false; 
    }); 
    $("#buttonWrap").delegate("a", "click", function() { 
     window.location.hash = $(this).attr("href"); 
     return false; 
    }); 

$(window).bind('hashchange', function(){ 
    newHash = window.location.hash.substring(1); 
    if (newHash) { 
     $mainContent 
      .find("#guts") 
      .slideToggle(500, function() { 
       $mainContent.hide(); 
       $.ajax({ 
        url: newHash, 
        dataType: 'html', 
        success: function(data) { 
         $mainContent.html($(data).find('#appContent').html()); 
         $mainContent.slideToggle(500, function() { 
          $pageWrap.animate({ 
           height: baseHeight + $mainContent.height() + "px" 
          }); 
         }); 
         $("nav a").removeClass("current"); 
         $("nav a[href="+newHash+"]").addClass("current"); 

         //RE-FIRE OTHER SCRIPTS ON AJAX CONTENT LOAD 

         //Phone Field Format 
         $(function() { 
          $("#phone").mask("(999) 999-9999",{placeholder:" "}); 
         }); 
        } 
       }); 
      }); 
    } 
}); 

$(window).trigger('hashchange'); 

}); 

編輯：全碼答案