jquery幫助運行關鍵事件

我試圖總結文本框中的值並將總和放在span標記中。我有功能正常工作（有點......）。我的問題是「KEYUP」事件不適用於頁面加載後添加的表單元素。jquery幫助運行關鍵事件

例如，當頁面呈現時，它會顯示一個INPUT框，用戶可以在其中輸入一個數字。有一個「添加」鏈接，可以克隆具有INPUT框的鏈接，從而允許用戶添加他們想要的任意數量的元素。我使用class屬性將所有輸入框綁定在一起，所以我可以使用jqueries .each（）來總結它們。

這是代碼的作用。如果我動態地添加3或用於文本框，那麼keyup事件只會在頁面呈現時最初在頁面上的第一個INPUT框中執行......但是當我在此框中鍵入值時，動態創建的輸入框中的數字會得到總結爲他們應該。所以，它是一種工作，但我希望keyup事件也可以從動態輸入框中觸發。

我正在使用jqueries「.after（）」將元素添加到dom中。

這裏是jQuery代碼：

$(document).ready(function() { 

//ADD INCOME TOTALS 
$('.'income_txt\').each(function() { 


$(this).keyup(function(){calculateSum('income_total', 'income_txt');}); 
}); //end income totals 

}); //end document ready

下面是存儲在一個.js文件

//CALCULATESUM function 
function calculateSum(ele, classname) 
{ 
    var sum = 0; 
    //iterate through each textboxes and add the values 
    $("."+classname).each(function() { 

     //add only if the value is number 
     if(!isNaN(this.value) && this.value.length!=0) { 
      sum += parseFloat(this.value); 
     } 

    }); 
    $("#"+ele).html(sum);

}

這裏的HTML標記功能：

<input class="income_txt" type="text" name="income_value1" id="' . $property_id . '_income_value_id1" />

任何th在如何完成？

感謝您的幫助。

來源

2010-02-02 Ronedog

恩，謝謝...新網站...不知道這是有事可做。我通常只是回答我的感謝評論。我會開始做你告訴我如何做帕特里克的。 – Ronedog 2010-02-02 18:50:16

當您克隆輸入時，您是否在呼叫中添加'true'？這也會克隆這些事件。

$('.myElement').clone(true);

來源

2010-02-02 18:01:01 user113716

帕特里克，非常感謝。我正在使用.clone（），但通過添加.clone（true）它完美地工作！再次感謝！ – Ronedog 2010-02-02 19:00:03

每次你動態地添加新元素，你需要將其註冊爲keyup事件：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
    <title>Test</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script> 
    <script type="text/javascript"> 
    $(function() { 
     $('input:text').keyup(calculateSum); 
     $('a').click(function() { 
      var newElement = $('<input type="text" />'); 
      $('#container').append(newElement); 
      newElement.keyup(calculateSum); 
      return false; 
     }); 
    }); 

    function calculateSum() { 
     var sum = 0; 
     $('input:text').each(function() { 
      var value = $(this).val(); 
      if(!isNaN(value) && value.length !== 0) { 
       sum += parseFloat(value); 
      } 
     }); 
     $('span#result').html(sum); 
    } 
    </script> 
</head> 
<body> 
<div id="container"> 
    <input type="text" /> 
</div> 
<span id="result"></span> 
<a href="#">Add element</a> 

</body> 
</html>

來源

2010-02-02 17:58:16

您應該使用jQuery的生活（）函數，該函數獲得動態添加到DOM

元素

http://api.jquery.com/live/

來源

2010-02-02 18:00:46 simon

正在從具有附加事件的元素克隆元素，因此不需要live（）。相反，.clone（true）在這種情況下使用。 – user113716 2010-02-02 18:02:13

jquery幫助運行關鍵事件

回答

相關問題