當用jQuery單擊複選框時更改類和ID

我在html頁面上有一個複選框，當它被選中時，我想更改一個div的ID和另一個div的類。當用jQuery單擊複選框時更改類和ID

這是我寫的做它的代碼：

HTML：

<li><input type="checkbox" name="x" value="1" class="home6" /> Check this</li>

JQuery的：

$(function(){ 
    if ($('.home6').is(':checked')) { 
     $('.hider2').addClass('.hiderx').removeClass('.hider2'); 
     $('#next1').attr('id','next4'); 
    }; 
};

但是這對我的HTML沒有影響。

我已經嘗試在控制檯中進行調試，但它不會引發錯誤。

我不認爲事件會被觸發，因爲我已經嘗試在if語句中添加警報，但是，讀取了documentation for the :checked selector，但此代碼接縫合適。

來源

2013-06-20 CJH

那麼你的'更改事件'代碼在哪裏？順便說一句，你不應該改變一個元素的屬性ID，沒有理由去做 –

你不需要'addClass'調用參數中的'.' –

[示例]（http://jsfiddle.net/DNTrs/3）。 – Vucko

試試這個：

<li><input type="checkbox" name="x" value="1" class="home6" /> Check this</li>

和相應的jQuery代碼：

$(function(){ 
    $('.home6').on('change', function() { 
     if($(this).is(':checked')) 
     { 
      $('.hider2').addClass('hiderx').removeClass('hider2'); 
      $('#next1').prop('id', 'next4'); 
     } 
    }); 
});

來源

2013-06-20 10:43:46 BenM

您應該將change或click事件綁定到您的複選框以執行腳本。（。）

，並在你的代碼點在addClass和removeClass是不正確

來源

2013-06-20 10:43:17 Rab

試試這個： -

$(function(){ 
    $($('.home6').change(function(){ 
    if ($(this).is(':checked')) { 
     $('.hider2').addClass('hiderx').removeClass('hider2'); 
     $('#next1').attr('id','next4'); 
    }; 
    }; 
});

來源

2013-06-20 10:44:51

你的'addClas（）'和'removeClass（）'中的'.'字符是多餘的。你也有一個錯誤的jQuery函數（例如'$（$（'）。 – BenM

@BenM謝謝... –

據工作：http://jsfiddle.net/balintbako/KK2Xr/

if ($('.home6').is(':checked')) { 
    $('.hider2').addClass('hiderx').removeClass('hider2'); 
    $('#next1').attr('id','next4'); 
};

你是如何調用該函數？您需要製作一個動作處理程序或在document.ready上調用它，因爲它在小提琴中。

來源

2013-06-20 10:46:17

當用jQuery單擊複選框時更改類和ID

回答

相關問題