jQuery - 防止進一步的代碼執行，直到顯示html後

我正在使用閃存保存方法的jquery webcam plugin。我想在用戶點擊保存後設置一條消息，以便他們知道它正在保存。我的代碼是這樣的：jQuery - 防止進一步的代碼執行，直到顯示html後

$('#savepicmessage').html("Saving picture, please wait"); 
webcam.capture(); 
webcam.save('/savephoto.php');

問題是隻有在保存圖片後才顯示「保存圖片」消息。有沒有辦法阻止執行.html（「保存圖片，請稍候」）調用後的代碼，以便在消息顯示之前不會執行該代碼？

我可以用setTimeout實現它，並捕獲並保存從那裏調用的函數，但這不夠可靠。

我看着.when和deferred.then，但似乎沒有工作。

來源

2012-07-05 Ben Holness

我必須承認在這一個完全神祕化。 .html（）不是一個動畫調用，不應該被定時器啓動。通過此代碼的單個線程在調用這兩個函數之前應完全完成對DOM的更改。這個問題在多個瀏覽器中是否一致？此外，如果您使用Firebug或其等價物在webcam.capture（）處設置斷點，HTML是否會在此時更新？ – 2012-07-05 20:33:59

它發生在Firefox，鐵和IE（也許別人，這就是我所嘗試的）。如果我在firebug中設置了一個斷點，那麼在腳本被斷點停止之前HTML會顯示更新。 – 2012-07-05 21:06:32

一般來說，我使用promise和諸如$ .when（）的東西來協調異步事件，如AJAX調用或動畫。但事實上，這種行爲幾乎就像它是異步的，這對我來說太神奇了。

但是，我有一個建議。你可以在第一次調用之後循環使用$（'＃savepicmessage'）。html（）來設置它並測試返回的內容嗎？也許一旦返回的值與您嘗試設置的值相匹配，那麼您可能會遇到網絡攝像頭功能，並且在調用網絡攝像頭之前用戶將看到您的消息。

來源

2012-07-05 21:15:25

這不是理想的解決方案，但我認爲這是最好的解決方法。謝謝！ – 2012-08-28 20:05:20

根據你的插件的文檔，你會結構的插件像這樣的裝載：

$("#camera").webcam({ 
    width: 320, 
    height: 240, 
    mode: "callback", 
    swffile: "/download/jscam_canvas_only.swf", 
    onTick: function() {}, 
    onSave: function() { 

     $('#savepicmessage').html("Saving picture, please wait"); 

    }, 
    onCapture: function() {}, 
    debug: function() {}, 
    onLoad: function() {} 
});

以前沒有使用這個插件，所以不知道你會做這onSave,onTick,onCapture或onLoad，但如果你顯示你的初始化代碼，會更有幫助。

來源

2012-07-05 20:23:50

我沒有使用回調方法，我使用保存方法，所以它不像這樣構造。這個問題不是特定於網絡攝像頭插件，它是一個更通用的jquery問題，關於如何阻止下一件事發生，直到.html完成它的工作。 – 2012-07-05 20:50:51

我沒有看到'.html（）'有一個回調的目的，因爲它發生得太快了。下一個最好的事情，如果不是插件使用'setTimeout（）' – 2012-07-05 21:27:47

jQuery - 防止進一步的代碼執行，直到顯示html後

回答

相關問題