使用复选框添加和删除 div 属性

Question

我需要将 id 添加到 div。

我的代码不起作用。

    <div class="quote-box-col14" for="seo">
<label for="seo" class="quote-service-seo">SEO</label>
<input type="checkbox" name="seo" id="seo" value="Y" class="checkbox-seo" />
</div>

js代码

$('#quote-box-col14').change(function(){
    if($(this).is(":checked")) {
        $( "#quote-box-col14" ).attr( "id", "check" );
    } else {
       $( "#quote-box-col14" ).removeAttr("id");
    }
});

js fiddle - http://jsfiddle.net/3syqfnzk/

Answer 1

您使用的 ID 有误。使用 #seo 而不是 #quote-box-col14 的更改事件。

和$( ".quote-box-col14" )而不是$( "#quote-box-col14" )。

像这样使用：

$('#seo').change(function(){

        if($(this).is(":checked")) {

            $( ".quote-box-col14" ).attr( "id", "check" );
        } else {
           $( ".quote-box-col14" ).removeAttr("id");
        }
    });

勾选Fiddle

Answer 2

首先没有id="quote-box-col14"。 quote-box-col14 是一个 class。另外，您没有在 checkbox 上收听。只需在 #seo.

上收听

    $('#seo').change(function(){
        if($(this).is(":checked")) {
            $('.quote-box-col14').attr("id", "check");
        } else {
           $('.quote-box-col14').removeAttr("id");
        }
    });

Answer 3

<div class="quote-box-col14" for="seo">
  <label for="seo" class="quote-service-seo">SEO</label>
  <input type="checkbox" name="seo" id="seo" value="Y" class="checkbox-seo" />
</div>

Jquery 代码应该是

$('#seo').change(function(){
if($(this).is(":checked")) {
  $( ".quote-box-col14" ).attr( "id", "check" );
} 
else 
{
  $( ".quote-box-col14" ).removeAttr("id");
}
    });

这对您来说效果很好，因为 onChange 应该用于例如输入类型 <input type="checkbox" name="seo" id="seo" value="Y" class="checkbox-seo" /> 不是 div class 也可以通过 . 而不是 #

访问

 Note: # use for id and .use for class

工作示例是 Demo Here 您可以通过检查 Element

来查看

使用复选框添加和删除 div 属性

add and remove div attribute with checkbox

html

javascript

php

random

checkbox