更清洁的方式来包装jquery函数

时间:2016-07-12 10:06:06

标签: jquery css function

我正在构建一个品牌编辑屏幕,其中包含jQuery驱动的颜色变化预览。

我已经设置了一些jQuery函数,但需要更多相同的函数,并且想知道是否有更简洁的方法来编写它以减少重复性。

{{1}}

http://codepen.io/rachelreveley/pen/akVkxK?editors=1010

1 个答案:

答案 0 :(得分:1)

您可以为事件侦听器使用命名回调:

$('input[name="p-color"]').keyup(pColor);
$('input[name="heading-color"]').keyup(hColor);

function pColor() {
  var pColor = ($(this).val());
  $('.custom-style-demo p').css({"color":pColor});
};

function hColor() {
  var headingColor = ($(this).val());
  $('.custom-style-demo h1, .custom-style-demo h2, .custom-style-demo h3').css({"color":headingColor});
};

然后您可以使用多个事件引用相同的回调。