我试图寻找我想要完成的事情,但是我找不到我要找的东西。
我希望在随Dreamweaver CS6提供的Spry手风琴内容中创建一个Next和Previous按钮。我搜索了SpryAccordion.js,发现以下代码:
Spry.Widget.Accordion.prototype.openNextPanel = function()
{
return this.openPanel(this.getCurrentPanelIndex() + 1);
};
Spry.Widget.Accordion.prototype.openPreviousPanel = function()
{
return this.openPanel(this.getCurrentPanelIndex() - 1);
};
所以我尝试用“#acc-step-1-next”作为Panel 1中的“Next”按钮来做到这一点。
<script>
$(document).ready(function(){
$("#acc-step-1-next").click(function(){
Spry.Widget.Accordion.prototype.openNextPanel = function(){
return ('#Accordian1').openPanel(this.getCurrentPanelIndex() + 1);
};
});
});
</script>
我想知道这样做是否会让事情变得简单!我该怎么办呢?这会起作用吗?
另外,使用“下一步”按钮,我可以将其设为“.acc-step-next”并普遍使用它,而不是单独分配新的ID吗?
编辑: 对不起,是的,我的答案不正确。我试过搜索init属性,但是没有成功。
这是从Accordion JS文件开始的:
(function() { // BeginSpryComponent
if (typeof Spry == "undefined") window.Spry = {}; if (!Spry.Widget) Spry.Widget = {};
Spry.Widget.Accordion = function(element, opts)
{
this.element = this.getElement(element);
this.defaultPanel = 0;
this.hoverClass = "AccordionPanelTabHover";
this.openClass = "AccordionPanelOpen";
this.closedClass = "AccordionPanelClosed";
this.focusedClass = "AccordionFocused";
this.enableAnimation = true;
this.enableKeyboardNavigation = true;
this.currentPanel = null;
this.animator = null;
this.hasFocus = null;
this.previousPanelKeyCode = Spry.Widget.Accordion.KEY_UP;
this.nextPanelKeyCode = Spry.Widget.Accordion.KEY_DOWN;
this.useFixedPanelHeights = false;
this.fixedPanelHeight = 0;
Spry.Widget.Accordion.setOptions(this, opts, true);
if (this.element)
this.attachBehaviors();
};
之后我添加了这个,但仍然没有运气:
var acc_next = document.getElementById("acc-step-next");
var acc_prev = document.getElementById("acc-step-prev");
$("acc_next").click(function(){
accordion.openNextPanel();
});
$("acc_prev").click(function() {
accordion.openPreviousPanel();
});
答案 0 :(得分:1)
我从未使用过Spry.Widget.Accordion,但我会尝试以下内容。
搜索手风琴初始化的代码,看起来应该是这样的:
var accordion = new Spry.Widget.Accordion("Accordian1",{});
并在下面添加:
$(".acc-step-next").click(function(){
accordion.openNextPanel();
});
它可能看起来像这样:
<script type="text/javascript">
$(document).ready(function(){
var accordion = new Spry.Widget.Accordion("Accordian1",{});
// Add a click handler to all buttons with the class 'acc-step-next' (yes you can do that)
$(".acc-step-next").click(function(){
// when the button is clicked, call the openNextPanel method of the accordion instance we saved above
accordion.openNextPanel();
});
});
</script>