[英]how to give an alert whenever the back-end data gets changed?
我們有像這樣的簡單json
{
name: "Johnson"
}
我正在使用ajax顯示如下名稱
$.ajax({
url: /info.json,
success: function(data) {
$('<span><b>' + data.name + '</b></span>').append('body')
}
});
輸出HTML如下所示
<body>
<label> name </label>
<span><b>Johnson</b></span>
</body>
讓我們假設我們現在得到的名稱從“ Johnson”更改為“ Michael”。
名稱更改后輸出Html,如下所示:
<body>
<label> name </label>
<span><b>Michael</b></span>
</body>
無論何時更改名稱,我們都希望顯示彈出窗口。沒有事件綁定到HTML文檔,如何實現?
在開發人員工具中,使用中斷選項我可以對其進行調試。 Javascript中還有其他方法可以實現同一目的嗎?
您應該嘗試使用javascript的setInterval(),它必須在幾次定義中一次又一次地檢查文件,例如
setInterval(function(){
$.ajax({
url: /info.json,
success: function (data) {
$('<span><b>'+data.name+'</b></span>').append('body')
}
});
},3000) //it will call after each 3 sec
它可能會幫助您:)
當服務器上的數據更改時,AJAX不會收到任何通知。
您可以嘗試長時間輪詢或類似的技術,或者(如果服務器和應用程序支持)使用websocket或HTTP / 2進行。
后者可能需要一些開發(甚至是服務器升級),具體取決於您的情況。
在上述情況下,我們是否應使用突變觀察器,以便每當更改數據時,用戶都會通過彈出窗口獲得通知。
我已經創建了列表項,每當添加項目時,我們都會彈出窗口。 沒有事件綁定到DOM。我已經通過使用Mutation觀察器實現了這一點。
<!DOCTYPE html>
<head>
</head>
<body>
<ol contenteditable oninput="">
<li>Enter the items</li>
</ol>
<script>
var MutationObserver = window.MutationObserver || window.WebKitMutationObserver || window.MozMutationObserver;
var list = document.querySelector('ol');
var observer = new MutationObserver(function(mutations) {
mutations.forEach(function(mutation) {
if (mutation.type === 'childList') {
var list_values = [].slice.call(list.children)
.map( function(node) { return node.innerHTML; })
.filter( function(s) {
if (s === '<br>') {
return false;
}
else {
return true;
}
});
alert(list_values);
}
});
});
observer.observe(list, {
attributes: true,
childList: true,
characterData: true
});
</script>
</body>
</html>
您需要編寫一個用於內容修改事件的函數。 您可以嘗試使用以下代碼:
$(document).on('DOMSubtreeModified', 'span b', function(){
console.log("name modified");
// add your action
})
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.