Question

我正在使用ParsleyJS进行复杂的多步骤表单以获取服务请求，我今天遇到了一个奇怪的问题。我有一些span元素被视为prev / next按钮。但有些spans有效，有些则无效。

我已将多步骤表单上传到我的服务器。你可以查看它here。出于演示目的，请在第一个表单输入中输入 IN1615 ，然后再进行两次。

在步骤3（Krok 3）中，下一个按钮不起作用。它甚至没有对jQuery click事件做出反应。 $('.next').click(function(){ console.log('it should work! why it is not?'); });

任何人都知道为什么会这样吗？任何帮助或建议对我都非常有用。感谢。

Answer 1

$（document）.on（）尝试将一些撇号添加到.next

$('.next').click(function(){ console.log('it should work! why it is not?'); });

另外，看起来并不太深，但如果动态构建任何东西，最好使用

$(document).on('click','.next', function() { 
    //console.log('it should work! why it is not?');
    console.log('It does. It does work. Use it.'); 
});

编辑：我检查了你的页面。当页面完成加载时，步骤3是不部分DOM。我按照你说的那样将“IN1615”粘贴到输入中，然后步骤3到步骤14 实际上动态创建。这就是你的$('.next').click()监听器不起作用的原因。
同样，我建议你在上面的代码片段中使用$(document).on()，因为它会监听触发的事件页面加载后构建的DOM元素。

如果您使用动态创建的html，$(document).on()是最佳做法。

Answer 2

使用

$('.next').click(function(){ console.log('it should work! why it is not?'); });

如果是静态Dom元素。否则使用on事件。

此处缺少单引号'.next'。

Answer 3

我不确定这会起作用，但在script.js中，请尝试替换：

$('.next, .prev').on( 'click', function () {

带

$('#main-form').on( 'click', '.next,.prev', function () {

出于某种原因，似乎$（'。next，.prev'）.... on ....仅附加到前两个跨度，即最初显示的跨度。

Span按钮不对jQuery中的click事件做出反应

3 个答案: