元素重新加載後Javascript代碼失敗

我有JS代碼來計算textarea中的字符數。它有一次工作，但一旦元素重新加載更新後的數據，它將隨後的請求失敗。元素重新加載後Javascript代碼失敗

<head> 
 
    <title>Test</title> 
 
    <script type="text/javascript" src="jquery.min.js"></script> 
 
</head> 
 

 
<body> 
 

 
<script> 
 
var counter = function(el,char_el,num_el){ 
 
    var cha = el.val().length; 
 
    var num = Math.ceil(cha/160); 
 
    if(num == 0) 
 
     num = 1; 
 
    char_el.html(cha); 
 
    num_el.html(num); 
 
} 
 
$(document).ready(function(){ 
 
    $("#TextMsg").keyup(function(){ 
 
     counter($(this),$(".char"),$(".num")); 
 
    }); 
 
    $("#TextMsg").keyup(); 
 
}); 
 
</script> 
 

 
<div id='showsn'> 
 
<textarea id="TextMsg"></textarea> 
 
<p><span class='char'></span>کارکتر</p> 
 
<p><span class='num'></span>پارت</p> 
 
</div> 
 

 
</body>

我怎樣才能獲得元素重新加載後的代碼工作？

來源

2015-09-17 parham2501

所以你說你改變代碼'textarea'的價值？代碼是在哪裏做的？它是否在AJAX調用中？ –

不，我不改變代碼中textarea的值。我只是重新加載我的div元素與一些數據，如第一次加載它。

的کارکتر

的پارت

– parham2501

您將需要包括通過AJAX更新'div'那麼代碼。 –

您將事件偵聽器添加到更新div內容時銷燬的元素。所以事件處理程序也被刪除！

你可以做的是使用jQuery on()方法，它允許在特定選擇器（例如texteara）上的父級div（不會被刪除）添加事件監聽器。所以事件處理程序不會被銷燬，並在div更新後繼續偵聽事件。

$('#showsn').on('keyup', '#TextMsg', function() { 
    counter($(this), ".char", ".num"); 
});

這裏你可以看到一個工作示例：http://jsfiddle.net/royto/pjfcgsx6/

來源

2015-09-17 20:01:14

非常感謝您親愛的Julien。它解決了我的問題。祝你好運 – parham2501

元素重新加載後Javascript代碼失敗

回答

相關問題