Question

我这里有4个按钮，但只有第一个按钮正在工作，我希望相同的jquery代码稍微更改一下，以便在所有这些按钮上工作... 我可以复制过去jquery 4次并将其更改为有效，但我希望更简单，更少的代码与一个jquery如何做到这一点？

CSS

.yellowBackground {    
    background-color: yellow;    
}

.redBackground {    
    background-color: red;
}

button.yellowBackground {    
    width:50px; 
    height:50px; 
}

HTML

<table>
    <tr>
      <td><button id="button"  class="yellowBackground">Pause</button></td>
      <td><button id="button"  class="yellowBackground">Pause</button></td>
      <td><button id="button"  class="yellowBackground">Pause</button></td>
      <td><button  id="button"  class="yellowBackground">Pause</button></td>
   </tr>
</table>

JS

$(function() {    
    $("#button").click(function() {    
        changeThumb();    
    });    
});

function changeThumb() {    
    $("#button").toggleClass("redBackground");    
}

Answer 1

adb shell monkey -p com.package.name -c android.intent.category.LAUNCHER 1必须是唯一的，您也可以使用类选择器ID执行此操作，如下所示：

yellowBackground

FIDDLE DEMO

此外，您错过了在$(function() { $(".yellowBackground").click(function() { $(this).toggleClass("redBackground"); }); }); html中打开<tr>标记。请更正

Answer 2

ID必须是唯一的，您可以将处理程序添加到类.yellowBackground或button

$(function() {

    $(".yellowBackground").click(function() {

        $(this).toggleClass("redBackground");

    });

});

Answer 3

在JQuery选择中选择类或id之前指定元素：

$(function() {

$('button#button').click(function() {

        $(this).toggleClass("redBackground");

    });

});

按钮大小和颜色变化

3 个答案: