Jquery函数执行与按钮点击

我有这个问题与Jquery它不执行按钮单击后的功能。Jquery函数执行与按钮点击

我试图完成的是当用户单击表单提交按钮时显示加载模式，然后在页面加载后它消失。

它显示页面加载时的加载模式...但没有任何按钮点击执行。

HTML表单按钮：

<button type="submit" name="btn-add" id="btn-add">Add Line</button>

PHP代码：

//Add Button 
if(isset($_POST['btn-add'])) 
{ 
    //PHP Code (Works Fine) 
}

JQuery的：

<!-- jQuery --> 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> 

<script type="text/javascript"> 
    $(window).load(function(){ 
     $(".loading").fadeOut(400); 
     $(".content_wrapper").delay(400).fadeIn(400); 
    }); 

    $('#btn-add').click(function() { 
     $(".content_wrapper").fadeOut(400); 
     $(".loading").delay(400).fadeIn(400);  
    }); 
</script>

来源

2016-11-07 Christiaan Karsten

没有错误吗？ jQuery工作吗？ – Tinsten

尝试通过属性选择瞄准的按钮，使等到DOM被加载。 $(document).ready()。

$(document).ready(function(){ 
    $('#btn-add[name="btn-add"]').click(function(){ 
     $(".content_wrapper").fadeOut(400); 
     $(".loading").delay(400).fadeIn(400);  
    }); 
});

来源

2016-11-07 21:13:28 Tinsten

谢谢，这个解决了它......就像@jeroen提到的那样，JQuery在文档的 –

一个可能的问题可能是您正在尝试之前，你的点击处理程序绑定DOM已加载/ #btn-add元素在页面上。

如果您显示的JavaScript位于html的头部，这将是问题所在。

为了避免这种情况，你应该在加载DOM时绑定你的点击处理程序：

// Execute this when the DOM is ready 
$(document).ready(function() { 
    $('#btn-add').click(function() { 
     $(".content_wrapper").fadeOut(400); 
     $(".loading").delay(400).fadeIn(400);  
    }); 
});

来源

2016-11-07 21:13:25 jeroen

我很好奇这个问题是怎么回事... – jeroen

您将需要延迟表单提交足够长的时间来显示您的div。而不是听点击按钮听表格提交..

<form id='myform'>...</form> 

$("#myform").submit(function(e){ 
    var form = this; 
    e.preventDefault(); // prevent submission 
    $(this).off('submit'); // remove handler to prevent recursion 
    $(".loading").delay(400).fadeIn(400, function(){ // add callback to submit the form in 
     $(form).submit(); // submit the forrm for real.. 
    }); 
});

来源

2016-11-07 21:16:39

Jquery函数执行与按钮点击

回答

相关问题