Question

我正在为我的页面制作过滤器。一切正常，但我唯一无法解决的问题是如何给我按下按钮的样式。当我尝试使用jQuery时，它会为所有按钮提供样式。

以下是我正在使用的代码：

<div class="filter_options">
    <!-- <div class="map_trigger"></div>
    <div class="list_trigger active"></div>-->
<h3 style="display: inline-block; margin-top: 15px!important;">Kies een discipline: </h3>
    <div id="uwpqsf_id">
    <form id="uwpqsffrom_43">
        <div class="uform_title">Projecten</div>
           <input type="hidden" name="unonce" value="8fa32e7b04">
           <input type="hidden" name="uformid" value="43">
           <input type="hidden" id="uajaxdiv" value=".projecten_list">
           <div class="uwpqsf_class " id="tax-radio-0">
              <span class="taxolabel-0">Disciplines</span>
              <input type="hidden" name="taxo[0][name]" value="Werkgebied">
              <input type="hidden" name="taxo[0][opt]" value="">
              <label>
              <input type="radio" id="tradio-0-0" class="tradio-0" name="taxo[0][term]" value="uwpqsftaxoall">Disciplines</label>
              <label>
              <input type="radio" id="tradio-0-1" class="tradio-0" name="taxo[0][term]" value="bagger">Bagger</label>
              <label><input type="radio" id="tradio-0-2" class="tradio-0" name="taxo[0][term]" value="groen">Groen</label>
              <label><input type="radio" id="tradio-0-3" class="tradio-0" name="taxo[0][term]" value="infra">Infra</label>
              <label><input type="radio" id="tradio-0-4" class="tradio-0" name="taxo[0][term]" value="milieutec">Milieutec</label></div>    

                    <script type="text/javascript">jQuery(document).ready(function($) {
    var formid = "#uwpqsffrom_43";
    $(formid).find('input, textarea, button, select').change(function(){ 
        process_data($(this)); 

        })
      ;})</script>
  <div style="clear:both"></div></form></div>       </div>

我需要在标签上找到一个我点击的样式，我尝试使用onclick标签功能，但是它给了所有标签css。

这是我尝试过的代码：

$( document ).ready(function() {
    $("label").click(function(){
       $("label").css("background-color: black;");
    });
});

我也无法向HTML添加任何新的ID或类，因为它是由插件生成的。

Answer 1

如果您按插件推送标签，则需要像这样更改代码

$(function(){
   $(document).on('click', 'label', function(){
      $(this).css("background-color", "red");
   });
});

$(function(){
    $(document).on('click', 'label', function(){
	 if( $('label').hasClass('red')){
	   $(this).each(function(index, element) {
              $('label').removeClass('red');
           });
	 }
       $(this).addClass('red')
    });
});

.red {
   background:red;
}

<label> click me </label>
<label> click me </label>
<label> click me </label>
<label> click me </label>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

Answer 2

df = df[df.groupby('users')['items'].transform('size') > 3]
print (df)
   users items
0      1     a
1      1     b
2      1     c
3      1     d

更改为

$(document).ready(function() {
    $("label").click(function(){
        $("label").css("background-color: black;");
    });
});

正如@deep所说。

Answer 3

在事件处理程序中使用$( document ).ready(function() { $("label").click(function(){ $(this).css("background-color: black;"); }); });仅引用触发事件的单个元素。

div.course-tabs ul li:nth-child(3n) {
display: none;
}

Answer 4

传入.css函数的参数不正确。

$(document).ready(function() {
    $("label").click(function(){
       $(this).css("background-color", "black");
    });
});

只给出我点击一个样式的元素

4 个答案: