Question

我认为一个相当简单的问题有一个简单的解决方案，但似乎无法想出正确的解决方法。

我有一组以3 x 3格式布局的按钮，我希望在单击时更改属性，但是要独立。我给了他们所有相同的课程，但是使用id来区分他们。

有没有办法在一行中为一组ID做同样的事情？或者我必须冗余地写出每个按钮的电话。

我想简单地说，我可以写

 $('.ready').click(function(){
   if('.ready'.is('#7') || '.ready'.is('#8') || '.ready'.is('#9')){
      execute code.
   }
 });

非常感谢任何帮助！

Answer 1

使用.attr()功能获取id属性。

$('.ready').click(function() {
    var id = $(this).attr('id');
    if (id === '7' || id === '8' || id ==='9') {
        //execute code
    }
});

由于你的id是数字，你也可以只使用比较运算符。请参阅下面的工作示例，该示例将根据ID告诉您单击了哪一行。

$(document).ready(function() {
  $('.ready').click(function() {
    var id = $(this).attr('id');
    if (id < 4) {
      $('#out').html('First row clicked');
    } else if (id < 7) {
      $('#out').html('Middle row clicked');
    } else {
      $('#out').html('Last row clicked');
    }
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="1" class="ready">1</button>
<button id="2" class="ready">2</button>
<button id="3" class="ready">3</button>
<br>
<button id="4" class="ready">4</button>
<button id="5" class="ready">5</button>
<button id="6" class="ready">6</button>
<br>
<button id="7" class="ready">7</button>
<button id="8" class="ready">8</button>
<button id="9" class="ready">9</button>

<span id="out"></span>

Answer 2

你可以简单地做

var pair1 = "#7, #8, #9";
var pair2 = "#2, #3, #4";
$('.ready').click(function(){

   if($(this).is(pair1)){
      execute code.
   }

   else if($(this).is(pair2)){
      execute some other code.
   }

});

Answer 3

您不需要类.ready选择器，因为ids足够独特，可以作为选择器。

 $('#7,#8,#9').click(function()
{
    // do stuff
});

JQuery：分配多个id来执行相同的功能。

3 个答案: