Question

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

编辑：我的问题是：是否可以使用方法动态构造链并将其应用于指定的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

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

从你想要实现的目标来看，你没有上述所有内容。只需将change事件绑定到checkbox es

即可

$("#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

＆＃13;

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

＆＃13;

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

＆＃13;

<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>

＆＃13;

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

2 个答案: