removeClass（）刪除類，但jQuery的記住它

在HTML頁面removeClass（）刪除類，但jQuery的記住它

<input type='text' name='quantity' id='quantity' /> 

<div class='submit'>Submit</div>`

在JS

$(document).ready(function(e) 
{ 
    $('input#quantity').keyup(function() 
    {   { 
     if($.isNumeric($('input#quantity').val())==true) 
     { 
    $('.submit').addClass('submit_success'); 
     } 
     else 
     { 
    $('.submit').removeClass('submit_success'); 
     } 
    }); 


    $('.submit_success').click(function(e) 
    { 
     document.write("The DIV is clicked"); 
    }); 
});

這樣的想法是當有人在input框中鍵入數值<div class='submit'>將被添加一個類'submit_success'並且看起來像<div class='submit submit_success'>。

觀察：

添加類 'submit_success' 上正常工作輸入數值。
當用戶輸入字母或用字母編輯數字值時，可以正常刪除類。
點擊功能正確執行，當用戶輸入數值數據，然後單擊<div>

問題是，當，

STEP 1出現：用戶在文本框中輸入一個數字。所以add類部分被執行。

第2步：現在用戶刪除他輸入的數字並在文本框中輸入一個字母。現在執行刪除類部分，並刪除submit_success類。

但仍然點擊功能激活。當用戶點擊<div>它在屏幕上寫道「點擊DIV」。但我想它不應該被執行。

如何解決這個問題？

來源

2013-08-20 Viswalinga Surya S

切換到on()而不是click()修復了您描述的問題。同樣在事件處理程序keyup事件$(this).val()可以用來檢索input的值而不是使用選擇器。

的Javascript

$('input#quantity').keyup(function() 
    {    
     if($.isNumeric($(this).val())==true) //simplified 
     { 
     $('.submit').addClass('submit_success'); 
     } 
     else 
     { 
     $('.submit').removeClass('submit_success'); 
     } 
    }); 

    $(document).on('click', '.submit_success', function(e) 
    { 
     alert("The DIV is clicked"); 
    });

JS小提琴：http://jsfiddle.net/snYrb/

來源

2013-08-20 08:43:07

removeClass（）刪除類，但jQuery的記住它

回答

相關問題