Javascript 如何将处理程序/函数附加到不同的对象

需要了解如何定义jQueryUI滑块并将其绑定到页面上的不同对象

函数setPhraseFontSize（）{
f1=$（“#滑块”）。滑块（“值”）；
f1=30-（f1*15）；
f2=$（“#滑块”）.滑块（“值”）；
f2=30+（f2*15）；
$（“#短语1”）.css({
“字体大小”：f1+“pt”
});
$（“#短语2”）.css({
“字体大小”：f2+“pt”
});
}
$（“#滑块”）.滑块({
值：0，
最小：-1，
最高：1，
步骤：0.1，
停止：功能（事件、用户界面）{
setPhraseFontSize（）；
$（'input[name=“weighting”]'）.val（$（“#slider”）.slider（“value”）；
mydata=$（“#反馈”）.serialize（）；
警报（“AJAX帖子：+mydata”）；
}
});

古老的
新的
在滑块元素上使用公共类名可能是最简单的方法


函数setPhraseFontSize（sliderNum，value）{
f1=30-（值*15）；
$（“#短语”+sliderNum）.css({
“字体大小”：f1+“pt”
});
}
$（“.slider”）.slider({
值：0，
最小：-1，
最高：1，
步骤：0.1，
停止：功能（事件、用户界面）{
var sliderNum=$（this.attr（“id”）.replace（“slider”），”；
var值=$（此）.slider（“值”）；
setPhraseFontSize（sliderNum，value）；//传递sliderNum和值
$（'input[name=“weighting'+sliderNum+''“]'）.val（value）；//改为目标为'this'
mydata=$（“#反馈”）.serialize（）；
警报（“AJAX帖子：+mydata”）；
}
});

古老的
新的
古老的
新的
我会用同一个类为每对短语创建不同的形式

然后您只需要在相应的上下文中查找元素，如下所示：

var currentWeight = $( 'input[name="weighting"]', $( this ) ).val();

您可以在
$（this）
的上下文中查找
输入
元素

要仅使用一个滑块，请在用户聚焦时将其移动到正确的形式：

$(".feedback").focusin(function() {
  $( this ).append( $("#slider") );
});

我给你留下一个片段：


函数setPhraseFontSize（反馈）{
f1=$（“#滑块”）。滑块（“值”）；
f1=30-（f1*15）；
f2=$（“#滑块”）.滑块（“值”）；
f2=30+（f2*15）；
$（“.phrase1”，反馈）.css({
“字体大小”：f1+“pt”
});
$（“.phrase2”，反馈）.css({
“字体大小”：f2+“pt”
});
}
$（“.feedback”）.focusin（函数（）{
if（$（this）.children（#slider”）.length）返回；
var currentwweight=$（'input[name=“weighting”]，$（this））.val（）；
附加（$（“#滑块”）；
$（“#滑块”）。滑块（“值”，当前权重）；
});
$（“#滑块”）.滑块({
值：0，
最小：-1，
最高：1，
步骤：0.1，
停止：功能（事件、用户界面）{
setPhraseFontSize（$（this.parent（））；
$（'input[name=“weighting”]，$（this.parent（））.val（$（this.slider（“value”））；
mydata=$（this.parent（）.serialize（）；
警报（“AJAX帖子：+mydata”）；
}
});
。反馈{
边框：1px纯红；
填充：10px；
利润率：10px；
}

古老的
新的
123
abc
在所有滑块目标上使用类名，并将其用作jquery选择器，或者将您的插件参数提取为声明对象并重复使用，我建议使用MV*框架，例如或而不是单独使用jQuery来操作DOM。隐藏短语输入的作用是什么？最初它是返回到服务器的往返帖子，表单/隐藏字段有点遗留问题：（实际的应用程序是一个laravel应用程序，因此一些表单对象是从中生成的-我正在看MVVW的东西，但这是一个陡峭的学习曲线；）似乎还需要非常小心地在客户端模型中暴露逻辑，并且还必须在不同的环境中进行相当多的重复验证（例如客户端上的JS，服务器上的PHP）以防万一有人入侵浏览器代码…（但我意识到这是语言政治，不属于这里！）感谢这一点-看起来很有效，但我使用了stumblor的另一个，效果很好