的Javascript/jQuery的緊密通知淡出

你好，我已經做出了基本的粘性通知，顯示在我的網站，我試圖讓它這樣你就可以通過點擊一個按鈕手動關閉它，但它似乎不工作？這裏是我的代碼：的Javascript/jQuery的緊密通知淡出

<script> 
    $(function() { 
     $("#closeBtn").click(function() { 
      $(".notification").fadeOut(500); 
      return false; 
     }); 
    }); 
</script> 

<div class="notification" id="success"> 
    Message sent 
    <a href="#" id="closeBtn"> 
     <div class="close"> 
      <div class="closeTxt">X</div> 
     </div> 
    </a> 
</div>

來源

2013-06-04 Engine

是動態創建的通知元素？ –

[It works]（http://jsfiddle.net/szn8H/） - 或者它是您遇到問題的「粘性」部分，您不希望通知在頁面刷新後回來？ – nnnnnn

現在不行，它會顯示是否已經發送的消息和它裏面的文本將改變依賴於 – Engine

嘗試使用.on()的元素動態創建

$(document).on('click','#closeBtn',function() { 
    $(".notification").fadeOut(500); 
    return false; 
});

來源

2013-06-04 12:30:28 PSR

完美地工作，謝謝你，我是JS/jQuery的新手。 – Engine

+1。你到底在那裏... – nnnnnn

因爲元素頁面加載後添加到DOM，你需要使用.on()而不是.click()：

$(document).on('click', '#closeBtn', function (e) { 
    e.preventDefault(); 
    $('.notification').fadeOut(500); 
});

來源

2013-06-04 12:30:49

當元素被動態地添加你有兩個選擇。

function myFadeOut() { 
     $(".notification").fadeOut(500); 
     return false; 
    }

使用上：

$(document).on('click', '#closeBtn', myFadeOut);

或者更乾淨，直接添加點擊的節點上，當你生成它：

var $myNode = $('<div class="someNode"></div>'); 
$myNode.click(myFadeOut); 
$(".foobar").append($myNode);

來源

2013-06-04 12:48:40 fmsf

的Javascript/jQuery的緊密通知淡出

回答

相關問題