理解JQuery插件的方法论&；API&x27；是由第三方开发的
我有一个关于第三方创建的JQuery插件和API以及理解它们的方法的问题。最近我下载了JQuery-massy/Infinite-scroll插件，但我不知道如何根据说明进行配置。所以我下载了一个完全开发的演示，然后手动删除了所有不会破坏功能的东西。留下的代码使我能够比文档更详细地理解插件 我现在在一个名为JQuery的插件中遇到了类似的问题。 如果您查看JQuery旋钮自述文件，它会说这是工作代码：理解JQuery插件的方法论&；API&x27；是由第三方开发的,jquery,jquery-knob,Jquery,Jquery Knob,我有一个关于第三方创建的JQuery插件和API以及理解它们的方法的问题。最近我下载了JQuery-massy/Infinite-scroll插件，但我不知道如何根据说明进行配置。所以我下载了一个完全开发的演示，然后手动删除了所有不会破坏功能的东西。留下的代码使我能够比文档更详细地理解插件 我现在在一个名为JQuery的插件中遇到了类似的问题。 如果您查看JQuery旋钮自述文件，它会说这是工作代码： <input type="text" value="75" class="dial"&
<input type="text" value="75" class="dial">
$(function() {
$('.dial')
.trigger(
'configure',
{
"min":10,
"max":40,
"fgColor":"#FF0000",
"skin":"tron",
"cursor":true
}
);
});
$（函数（）{
$（“.dial”）
.扳机(
“配置”，
{
“min”：10，
“最大”：40，
“fgColor”：“FF0000”，
“皮肤”：“tron”，
“游标”：true
}
);
});
<!DOCTYPE html>
<meta charset="UTF-8">
<title>knob</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/hot-sneaks/jquery-ui.css" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<script src="js/jquery.knob.js"></script>
<div id="button1">test </div>
<script>
$(function() {
$("#button1").click(function () {
$('.dial').trigger(
'configure',
{
"min":10,
"max":40,
"fgColor":"#FF0000",
"skin":"tron",
"cursor":true
}
);
});
});
</script>
旋钮
试验
$（函数（）{
$（“#按钮1”）。单击（函数（）{
$（'.dial'）.trigger(
“配置”，
{
“min”：10，
“最大”：40，
“fgColor”：“FF0000”，
“皮肤”：“tron”，
“游标”：true
}
);
});
});
$("#button1").click(function () {
$('.dial').trigger(
'configure',
{
"min":10,
"max":40,
"fgColor":"#FF0000",
"skin":"tron",
"cursor":true
}
);
});
$(function() {
$(".dial").knob();
}
希望对您有所帮助。下面是JQuery旋钮API的完整工作代码
<!DOCTYPE html>
<meta charset="UTF-8">
<title>knob</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/hot-sneaks/jquery-ui.css" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js" charset="utf-8"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.21/jquery-ui.min.js"></script>
<body>
<script src="js/jquery.knob.js"></script>
<input type="text" class="dial">
<script>
$(".dial").knob(
{
"displayPrevious":true,
"width": 100,
"min":0,
"max":4,
"data-angleOffset":+0,
"data-angleArc": +300,
"fgColor":"#ffec03",
"bgColor":"#ddd",
//"data-skin":"tron",
"thickness":.3,
"data-cursor":true,
}
);
</script>
<body>
<style>
body{
background-color:#000;
}
</style>
旋钮
$（“.dial”）。旋钮（
{
“displayPrevious”：正确，
“宽度”：100，
“min”：0，
“最大”：4，
“数据角度偏移”：+0，
“数据角弧”：+300，
“fgColor”：“ffec03”，
“bgColor”：“ddd”，
//“数据皮肤”：“tron”，
“厚度”：，
“数据游标”：true，
}
);
身体{
背景色：#000；
}