Jquery 简化此函数以获取和设置值

Jquery 简化此函数以获取和设置值,jquery,get,set,Jquery,Get,Set,有没有办法巩固这一职能?我有大约50个类似的函数,这似乎是一个非常麻烦的获取和设置这些值的方法 所有函数的格式都是相同的:当它将“获取”的任何值发生更改时,它会被触发,并基于主要元素的值(在本例中为Fabric\u Type)加上一些其他元素的值,设置目标元素的值(即Fabric\u Thickness)。大多数函数获取相同的5-10个元素的值(即项目或衬里),并在这些元素中查找相同的值(即运动夹克、夹克、外套)。我已经用每个元素的所有值设置了数组(即$Fabric\u Type=array(“

有没有办法巩固这一职能?我有大约50个类似的函数,这似乎是一个非常麻烦的获取和设置这些值的方法

所有函数的格式都是相同的:当它将“获取”的任何值发生更改时,它会被触发,并基于主要元素的值(在本例中为
Fabric\u Type
)加上一些其他元素的值,设置目标元素的值(即
Fabric\u Thickness
)。大多数函数获取相同的5-10个元素的值(即
项目
衬里
),并在这些元素中查找相同的值(即运动夹克、夹克、外套)。我已经用每个元素的所有值设置了数组(即
$Fabric\u Type=array(“羊绒”、“丝绸”、“缎子”);
$Item=数组(“运动夹克”、“连衣裙”、“夹克”、“外衣”);
等:-)

我(在伪代码中)尝试的是:

jQuery:

$("[name=Item],[name=Fabric_Type],[name=Lining],[name=Fabric_Construction]").change(function(){  
    if( $("[name=Fabric_Type]").val() === "Satin" || $("[name=Item]").val() === "Silk"){  
            if( $("[name=Item]").val() != "Blazer" && $("[name=Item]").val() != "Jacket" && $("[name=Item]").val() != "Outerwear" && "[name=Lining]").val() != "0") || 
            ( $("[name=Item]").val() === "Blazer" || $("[name=Item]").val() === "Jacket" || $("[name=Item]").val() === "Outerwear" && "[name=Lining]").val() === "0"){
                    $('[name=Fabric_Thickness]').val('2');  
            } if( $("[name=Item]").val() === "Blazer" || $("[name=Item]").val() === "Jacket" || $("[name=Item]").val() === "Outerwear" && "[name=Lining]").val() != "0" {
                    $('[name=Fabric_Thickness]').val('3');  
            } else {
                    $('[name=Fabric_Thickness]').val('1');  
            }
    }    
});    

change
块之外设置一个名为isThickerFabric(或域中最正确的名称)的函数:

然后,您可以通过以下两种方式之一简化该方法:

$("[name=Item],[name=Fabric_Type],[name=Lining],[name=Fabric_Construction]").change(function(){  
  if ( $("[name=Fabric_Type]").val() === "Satin" ) {
    var fabricThicknessElement = $('[name=Fabric_Thickness]');

    if ( isThickerFabric() && !hasLining || !isThickerFabric() && hasLining ) {
      fabricThicknessElement.val('2');
    } else if ( isThickerFabric() && hasLining() ) {
      fabricThicknessElement.val('3');
    } else {
      fabricThicknessElement.val('1');
    }
  }    
});
或者,有时,当我像您在这里一样拥有一些二进制属性时,我发现“保留分数”是很有价值的:


@未定义-否:-)在花了10分钟转换1rst函数后,我意识到必须有更好的方法来实现;-)这太神奇了:-D第一个答案很好,很简单,完全符合我的要求:-D我也对第二个方法很感兴趣,因为考虑到这种形式的其他方面,它可能是我采取的更好的方法。。。你介意解释一下吗?为什么你觉得这样“记分”很有帮助?另外,我不确定这是否重要,但大多数问题都是从4-8个元素中“获取”值,然后取决于主要元素apx的1的值。应用了6种不同的场景。我意识到,通过在函数外部定义“var fabritchicknesselement”,我可以进一步简化它:-d函数中标识是否有衬里工作不正常的部分。我不知道为什么,但结果是错误的(我不确定到底发生了什么,但看起来它给出了下一个等式的值)。我已经发布了一个提琴,所以你可以看到我指的是什么我修改了一点语法,现在它工作得很好,我更新了答案:-)关于保持分数。假设你在混合颜色。您可以想象确定结果所需的复杂if语句,例如if(蓝色和红色){purple}else if(红色和白色){pink}else if。。。实际上,如果我们可以量化(给分数)用户选择的每个选项,那么我们就不需要复杂的条件逻辑,例如if(red)colorValue+=“AA0000”;如果(蓝色)颜色值+=“0000AA”;,等
var isThickerFabric = function() {
  var item = $("[name=Item]").val();
  return item == "Blazer" || item == "Jacket" || item == "Outerwear";
}

var hasLining = function() {
  var lining = $("[name=Lining]").val();
  return lining != "0";
}
$("[name=Item],[name=Fabric_Type],[name=Lining],[name=Fabric_Construction]").change(function(){  
  if ( $("[name=Fabric_Type]").val() === "Satin" ) {
    var fabricThicknessElement = $('[name=Fabric_Thickness]');

    if ( isThickerFabric() && !hasLining || !isThickerFabric() && hasLining ) {
      fabricThicknessElement.val('2');
    } else if ( isThickerFabric() && hasLining() ) {
      fabricThicknessElement.val('3');
    } else {
      fabricThicknessElement.val('1');
    }
  }    
});
$("[name=Item],[name=Fabric_Type],[name=Lining],[name=Fabric_Construction]").change(function(){  
  if ( $("[name=Fabric_Type]").val() === "Satin" ) {
    var fabricThicknessElement = $('[name=Fabric_Thickness]');

    var thicknessScore = 1;
    if ( hasLining() ) {
      thicknessScore++;
    }

    if ( isThickerFabric() ) {
      thicknessScore++;
    }

    $('[name=Fabric_Thickness]').val(thicknessScore);
  }
});