jQuery - 刷新DIV內容

我在網頁上的jQuery彈出窗口中有一個窗體。 jQuery彈出窗口是一個名爲.vote-form的div，其中的窗體名稱爲「#form」。jQuery - 刷新DIV內容

當提交表單時，jQuery彈出窗口中的內容變爲成功消息。我需要這樣做，以便當關閉jQuery彈出窗口時，成功消息被刪除，並且表單被刷新回原始窗體，這樣當再次打開jQuery彈出窗口時，窗體再次顯示，而不是成功消息。

我對此結果的微弱嘗試涉及在關閉jQuery彈出窗口時刷新整個頁面。這部分有希望的結果，但是當頁面刷新時，大多數瀏覽器會彈出一個詢問用戶是否要重新提交表單內容的提示。我需要避免這一點。

這是我的代碼處理.vote形式收盤：

$('.vote-form-close').click(function(event) { 
    event.stopPropagation(); 
    $(".vote-form").fadeOut("normal"); 
    $("#the-lights").fadeTo("slow",0); 
    $("#the-lights").css({'display' : 'none'}); 
    window.location.reload(); 
});

我懷疑其可能僅刷新DIV，而不是整個頁面，但我不知道如何完成它。

有人能幫助我嗎？

編輯：基於下面的答案之一，我修改了我的代碼。我也想展示用於打開窗體了太多的代碼：

$('.vote').click(function() { 
    $(this).parent().find(".vote-form").fadeIn("normal"); 
    $("#the-lights").css({'display' : 'block'}); 
    $("#the-lights").fadeTo("slow",0.7); 
}); 
$('.vote-form-close').click(function(event) { 
    event.stopPropagation(); 
    $(".vote-form").fadeOut("normal"); 
    $("#the-lights").fadeTo("slow",0); 
    $("#the-lights").css({'display' : 'none'}); 
    $(".vote-form").load(window.location.href + " .vote-form-container"); 
});

這是問題所在 - 我在頁面上3種形式。當「vote-form-container」被加載時，其加載的ALL THREE形式到.vote-form框中 - 我如何修改代碼以僅加載作爲特定.vote-form的一部分的.vote-form-container - 我懷疑我必須使用$（本），但我試過的代碼修改到這一點，它沒有工作：

$(".vote-form")(this).load(window.location.href + " .vote-form-container");

我想我沒有錯。

編輯2：現在的形式後的「關閉」按鈕這麼想的工作被重新加載第一次：

$('.vote').click(function() { 
    $(this).parent().find(".vote-form").fadeIn("normal"); 
    $("#the-lights").css({'display' : 'block'}); 
    $("#the-lights").fadeTo("slow",0.7); 
}); 
$('.vote-form-close').click(function(event) { 
    event.stopPropagation(); 
    $(".vote-form").fadeOut("normal"); 
    $("#the-lights").fadeTo("slow",0); 
    $("#the-lights").css({'display' : 'none'}); 
    var current_form = $(this).closest('.vote-form'), 
    index = $('.vote-form').index(current_form) 
    current_form.load(window.location.href + " .vote-form-container:eq(" + index + ")"); 
});

來源

2012-07-03 Zach Nicodemous

不要重新加載頁面，但重定向用戶：

window.location.href = window.location.href.toString()

或負載使用Ajax的新形式：

$(".vote-form").load(window.location.href + " .vote-form");

欲瞭解更多關於Ajax方式看api.jquery.com/load/#loading-page-fragments

更新：

使用jQuery的index功能，您可以只更換當前的形式。

// I asume your button is in the form 
var current_form = $(this).closest('.vote-form'), 
    index = $('.vote-form').index(current_form) 

current_form.load(window.location.href + " .vote-form:eq(" + index + ")");

來源

2012-07-03 13:43:29 jantimon

這個代碼可以幫助，如果我有網頁上的表格的多個實例？看到我的編輯我原來的帖子 –

是否有可能給他們一個像'vote-form-1' – jantimon

它的可能，我想，但它有可能使用$這個選擇正確的實例嗎？我在上面擴展了我的帖子，請看一看 –

...我需要讓這個當jQuery的彈出窗口關閉，被刪除成功消息和形式刷新回到原來的形式...

所以，如果我很好理解：但是

$('.vote-form-close').click(function(event) { 
    event.stopPropagation(); 
    var vf = $(".vote-form"); 

    /* fadeout and remove inner content of the popup */ 
    vf.fadeOut("normal", function() { vf.empty(); }); 

    /* reset the form */ 
    document.getElementById('form').reset(); 
    ... 
});

來源

2012-07-03 13:44:44 fcalderan

jQuery - 刷新DIV內容

回答

相關問題