2013-09-25 42 views
0

我想創建一個登錄,這將根據提交的代碼在不同的內容中加載。其簡單的是這樣的:翻轉新內容

<button type="submit" value="BSend" class="l-button">code</button> 
<input type="text" name="bewerbung" class="l-input"> 

    Example: 
    CODE01 = GET CONTENT 01 
    CODE02 = GET CONTENT 02 
    CODE03 = GET CONTENT 03 
    CODE04 = GET CONTENT 04 

爲了讓我想用一個lib更有效的負載稱爲jQuery flip effect with Flippy它。爲了使它在我的代碼上工作,它只需要一個容器flipbox容器。在此容器中,翻轉類翻轉盒的內容將被翻轉。

我已經嘗試過了我的網站的另一個網站:

$(document).on('submit', 'form.ajax', function (e) { 
     e.preventDefault(); 
     var that = $(this), 
     url = that.attr('action'), 
     type = that.attr('method'), 
     data = {}; 
     that.find('[name]').each(function (index, value) { 
     var that = $(this), 
      name = that.attr('name'), 
      value = that.val(); 
     data[name] = value 
     }); 
     $.ajax({ 
     url: url, 
     type: type, 
     data: data, 
     success: function() { 


      $(".flipbox").flippy({ 
       color_target: "", 
       duration: "500", 
       verso: "<article class=\"leftk\"><header><h3>Kontakt</h3></header><form action=\"submit.php\" method=\"post\" title=\"Kontaktformular\" class=\"ajax\"><label for=\"name\">Name</label><input name=\"name\" type=\"text\" title=\"Name\"><label for=\"email\">E-Mail-Adresse</label><input name=\"email\" type=\"text\" title=\"Email\"><label for=\"auswahl\">Präfix</label><label class=\"label\"> <select name=\"auswahl\" class=\"dropdown\"> <option selected value=\"Webdesign\">Anfrage Webdesign</option> <option value=\"Persoenliche\">Anfrage persönlich</option> <option value=\"Andere\">Alles andere</option> <option value=\"Spam\">Spam</option></select></label><textarea name=\"message\" title=\"Nachricht\"></textarea><button value=\"Send\" type=\"submit\" class=\"button\">Absenden</button></form></article><aside id=\"robot\"><ul class=\"social-icons clearfix\"> <li class=\"facebook\"><a href=\"#\">Facebook</a></li> <li class=\"google\"><a href=\"#\">Google</a></li> <li class=\"skype\"><a href=\"#\">Skype</a></li> <li class=\"twitter\"><a href=\"#\">Twitter</a></li> <li class=\"youtube\"><a href=\"#\">YouTube</a></li></ul></aside>", 
       onFinish: function() { 
        $("#no-color").css("background-color", "transparent"); 
       } 
      }); 
     } 
     }); 

因此,大家可以看到需要在這反面啄寫入不論什麼原因,新的內容。

那麼我該如何做到這一點與我的登錄代碼?我不想在這件事上寫下新的內容,因爲當他打開我的js文件時,每個人都可以看到內容。除此之外,它看起來有點凌亂。

回答

0

Ajax調用的結果傳遞給success回調:

$.ajax({ 
    ... 
    success: function(htmlAnswer) { 
     $(".flipbox").flippy({ 
      ... 
      verso: htmlAnswer, 
      ... 
     }); 
    } 
}); 

當發送的提交要求,服務器不會回到上顯示的HTML,對不對?

否則,你可能需要鏈另一個 Ajax調用來獲取正確的內容...