fullpage.js 提交按钮问题

Question

我在我的网页上使用 js-Plugin fullpage，在第二部分有一个提交按钮，它应该启动一个基于 js 的演示功能。不幸的是，按下按钮只是让我跳回到第 1 部分而没有启动该功能（或者启动并立即再次停止它，我不确定）。这是代码：

HTML

<input type="submit" value="Start" id="btn1"/>

js

$('#btn1').click(function(){
    $.WizDemo();
});

function WizDemo() {
some code;
};

Answer 1

From fullPage.js FAQs:

My other plugins don't work when using fullPage.js

Short answer: initialize them in the afterRender callback of fullPage.js.

Explanation: if you are using options such as verticalCentered:true or overflowScroll:true of fullPage.js, your content will be wrapped inside other elements changing its position in the DOM structure of the site. This way, your content would be consider as "dynamically added content" and most plugins need the content to be originally on the site to perform their tasks. Using the afterRender callback to initialize your plugins, fullPage.js makes sure to initialize them only when fullPage.js has stopped changing the DOM structure of the site.

From fullPage.js docs:

afterRender() This callback is fired just after the structure of the page is generated. This is the callback you want to use to initialize other plugins or fire any code which requires the document to be ready (as this plugin modifies the DOM to create the resulting structure).

你有你的答案。在 afterRender 回调中添加代码。

Answer 2

好的，我知道了。

<input type="submit"/>

重新加载页面，因此您必须使用

<input type="button"/>

哪个没有。

我在这里找到了答案How do I make an HTML button not reload the page

fullpage.js 提交按钮问题

fullpage.js issue with submit button

javascript

jquery

submit

button

fullpage.js