如何根据复选框链接方法？

Question

我可以将方法存储在变量中吗？那么如何使用变量作为方法呢？或者我应该更好地创建一个带有选择器作为参数的函数？我不想使用评估。

编辑：我的问题是：是否可以使用方法动态构建链并将其应用于指定的 DOM 元素？

<input type="checkbox" name="methods" id="check0">change color
<input type="checkbox" name="methods" id="check1">change width
<div class="performedOn"></div>
<script>
var storedmethod = '';
if ($("#check0").prop("checked")==true) {
    var storedmethod = '.css({"background-color": "red"});';
    $(".performedOn")[storedmethod];
}
if ($("#check1").prop("checked")==true) {
    var storedmethod = storedmethod  + '.width(200)';
    $(".performedOn")[storedmethod];
}
</script>

Answer 1

Can I store methods in a variable? Then how to use a variable as a method? Or should I better create a function with a selector as a parameter? I don't want to use eval

从您要实现的目标来看，您不必满足以上所有条件。只需将 change 事件绑定到 checkboxes

$("#check0").change(function(){
   if( $(this).prop("checked") == true ) {
       $(".performedOn").css({"background-color": "red"});
   }
})
$("#check1").change(function(){
   if( $(this).prop("checked") == true ) {
       $(".performedOn").css({"width": "200"});
   }
})

演示

$("#check0").change(function() {
  if ($(this).prop("checked") == true) {
    $(".performedOn").css({
      "background-color": "red"
    });
  }
})
$("#check1").change(function() {
  if ($(this).prop("checked") == true) {
    $(".performedOn").css({
      "width": "200"
    });
  }
})

.performedOn
{
   width:100px;
   height:100px;
   border:1px solid #000;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="methods" id="check0">change color
<input type="checkbox" name="methods" id="check1">change width
<div class="performedOn"></div>

Answer 2

$(document).ready(function(){
$('#check0').change(function(){
$('.performedOn').toggleClass('color')
})
$('#check1').change(function(){
$('.performedOn').toggleClass('width')
})
})

.performedOn{
   width:100px;
   height:100px;
   border:1px solid #000; 
}
.color{
background-color:red
}
.width{
width:200px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" name="methods" id="check0">change color
<input type="checkbox" name="methods" id="check1">change width
<div class="performedOn"></div>

如何根据复选框链接方法？

How to chain methods according to checkboxes?

javascript

jquery

method-chaining