通过jquery选择器进行迭代

Question

我的代码肯定是多余的，我想让它更短更干净。

所以我有一个五个域的列表，每个域都有一个滑块。我使用了五次"简单滑块"。我有这个：

$("#domain-1").bind("slider:changed", function (event, data) {
  alert(data.value);
  alert(data.ratio);
});
$("#domain-2").bind("slider:changed", function (event, data) {
  alert(data.value);
  alert(data.ratio);
});
$("#domain-3").bind("slider:changed", function (event, data) {
  alert(data.value);
  alert(data.ratio);
});
$("#domain-4").bind("slider:changed", function (event, data) {
  alert(data.value);
  alert(data.ratio);
});
$("#domain-5").bind("slider:changed", function (event, data) {
  alert(data.value);
  alert(data.ratio);
});

我该如何简化它，这样我就不必重复代码了？我必须使用ID，因为每个滑块都应该是唯一的。非常感谢。

Answer 1

使用多选择器（"selector1，selector2，selectorN"）

$("#domain-1, #domain-2,#domain-3,#domain-4,#domain-5").bind("slider:changed", function (event, data) {
  alert(data.value);
  alert(data.ratio);
});

Answer 2

为它们分配一个类可能会更容易。

$(".domains").bind("slider:changed", function (event, data) {
    alert(data.value);
    alert(data.ratio);
 });