當if/else完成時jQuery

如果使用jQuery出現問題，我不知道如何解決它。簡單地說Ive得到了以下幾點：當if/else完成時jQuery

var overlay; 

if(condition == "test") { 
    overlay = $("<div></div>"); 
} 
else if (condition == "test2") { 
    console.log("first-log"); 
    overlay = $("<span></span>"); 
} 

console.log("second-log"); 
overlay.prependTo("body");

如果條件相匹配的「如果」，一切工作正常，覆蓋填充內容，並預先考慮到身體。

雖然條件與'else if'匹配，但我得到的錯誤是overlay未定義。

所以我推出了一些console.log（）來查看我的代碼在做什麼。這兩個console.log操作都被觸發，但在我的瀏覽器控制檯中，我首先看到「第二次日誌」，然後是「第一次日誌」。

即使條件匹配，我的代碼也會在'if/else if'結束之前嘗試前置。

我試着尋找答案，但我什麼也找不到，所以我希望這裏有人能幫助我。謝謝！

jsfiddle of my code

來源

2013-12-10 ronnyrr

我想代碼應該是overlay = $（「」）; – abc123

注意到並改變了這一點。但這只是一個虛擬代碼，很快寫道。我自己的代碼更復雜，所以這只是一個例子。 – ronnyrr

代碼是否不止一次地被調用？它是在一個事件處理程序中，setTimeout，還有其他的東西嗎？ – Boldewyn

你應該在你的程序的開始初始化VAR覆蓋。

來源

2013-12-10 08:56:52 user3085570

誰給-1：爲什麼？鑑於發佈的代碼，這是一個很好的解決方案。 'var overlay = $（''）;'修復了缺少'else'的情況。 – Boldewyn

我試過這個。按照預期，覆蓋層不再被定義。但是我添加到de'else-if'中的疊加層的內容不會被添加。 – ronnyrr

@Boldewyn - 可能是因爲答案不清楚它被初始化的內容。正如問題中的代碼所示，它也不會改變'condition ==「test2」' – Krease

我主要用回調或承諾來解決這類問題。隨着回調，你可以試試這個：

var overlay = $(""); 

testCondition = function(callback) { 

    if(condition == "test") { 
    overlay = $("<div></div>"); 
    } 
    else if (condition == "test2") { 
    console.log("first-log"); 
    overlay = $("<span></span>"); 
    } 

    callback(overlay); 

}

，並調用這個函數是這樣的：

testCondition(function(callback){ 
    overlay.prependTo("body"); 
});

這裏是一個fiddle

正如你可以在控制檯檢查，正確的元素被前置;）

來源

2013-12-10 09:03:24 Igle

的任何行爲。不知道，這怎麼可能有助於擺在首位。只需將噪音添加到完美的「if」/「else」中即可。（不要誤會我的意思，我自己很喜歡承諾。） – Boldewyn

是的，我知道，這裏有一種骯髒的解決方法，但是他給出的這些信息是我能給出的唯一工作答案。 @ronnyrr：如果你可以添加更多的代碼，我們可以找到更好的解決方案;） – Igle

@ user3085570的答案呢？完美無缺的工作。當'condition =='test3''時，你的也會失敗。 – Boldewyn

你的代碼似乎沒有什麼問題，我只是測試它，它的工作！

你的代碼測試 - http://jsfiddle.net/9Pb7u/

如果一切都失敗了一個簡單的解決將是把裏面的prependTo的if語句 - 另外，還要確保你一些文字或樣式添加到div和跨越，否則他們可能贏得」直到你看到源代碼纔可見。

if(condition == "test") { 
    $("<div>TEST</div>").prependTo("body"); 
} else if (condition == "test2") { 
    $("<span>TEST 2</span>").prependTo("body"); 
}

工作http://jsfiddle.net/9f93d/

來源

2013-12-10 09:05:39 Wez

我想我的代碼有點複雜，使用它。檢查我的JSFiddle知道我的意思。 – ronnyrr

我想是的，但這是你給的例子。我從JSFiddle獲得的所有內容都是語法錯誤 - 可能會修復這些錯誤並首先包含相關庫。 – Wez

，關鍵的問題是與代碼的jsfiddle您的更新。根據您的jsfiddle鏈接，它似乎有這樣的基本結構：

if (resource=="iframe") { 
    console.log("resource is iframe"); 

} else if (resource=="json") { 
    $.getJSON("someUrl", function(data) { 
     console.log("resource is json"); 
    }); 
} 

console.log("at the end - one of the above log statements should be hit");

不過，我想你試圖簡化問題的問題是，你的情況來處理resource=="json"沒有被擊中。

這可能是因爲調用的getJSON是異步執行 - 裏面的功能，如果塊不執行內聯，當你想到它，但後來，當的getJSON調用有結果，以及在休息之後外部函數執行完畢

固定的方法之一是使用（類似於Igle's answer）回調，以確保您的處理代碼不執行，直到後來改變結構：

function executeAfterIf() { 
    console.log("at the end - one of the above log statements should be hit"); 
} 

if (resource=="iframe") { 
    console.log("resource is iframe"); 
    executeAfterIf(); 

} else if (resource=="json") { 
    $.getJSON("someUrl", function(data) { 
     console.log("resource is json"); 
     executeAfterIf(); 
    }); 
}

在這個基本重構，executeAfterIf是在處理if塊的任何一種情況後調用的回調函數。

當然，還有其他模式可以處理這類事情;您選擇哪一個取決於您項目其餘部分的代碼。

來源

2013-12-10 16:47:43 Krease

當if/else完成時jQuery

回答

相關問題