我做了一个php表单，其中我想显示加载gif，如果满足某些条件。这是一个可读的伪代码/示例，我需要在jquery中使用的逻辑。
if (file_input_is_set && submit_button_is_clicked) {
<div class="progress-bar">tada...loading_gif</div>
}
我有这两个代码，它们单独工作得很好。第一个代码显示了当文件输入被设置时正在加载的gif。
jQuery().on('change', 'input[type="file"]', function(e) {
第二个代码显示了当表单提交按钮被点击时正在加载的gif。
jQuery("input[name='profile_submit']").click(function (e) {
由于我对jQuery几乎一无所知，我需要帮助将这些事件放在一起。如果我用错了术语，请原谅。这是我尝试过的不工作，它显示加载gif甚至在我按下提交按钮之前。所以我需要一个像php的&&运算符一样的函数，我不知道你怎么在jquery中做到这一点。
jQuery().on('change', 'input[type="file"]', function(e) {
jQuery("input[name='profile_submit']").click(function (e) {
//jQuery('#submit-button').hide();
jQuery('.progress-bar').fadeIn(1000);
});
});
注意:你在代码中看到很多jQuery的原因是由于wordpress(使用该表单)，因为它需要它处于无冲突模式。
重述问题(与@webkit提示):我如何也检查如果File_input_is_set/当提交事件触发时有效?
从最后一个动作开始，表单提交。然后检查文件输入中是否存在文件:
jQuery("input[name='profile_submit']").click(function (e) {
if( jQuery('input[type="file"]').val() != '' ){
jQuery('.progress-bar').fadeIn(1000);
}
});
JSFiddle demo: http://jsfiddle.net/nDNP5/
你可以这样做:
jQuery("input[name='profile_submit']").click(function (e) {
// check to see if file is valid
if (jQuery('input[type="file"]').val() != "") {
// load
jQuery('.progress-bar').fadeIn(1000);
}
});
或者这样:(只有当文件被选中时，你才会激活提交btn)
jQuery('input[type="file"]').on('change', function (e) {
// check to see if file is valid
if (jQuery('input[type="file"]').val() != "") {
jQuery("input[name='profile_submit']").off().on('click', function () {
jQuery('.progress-bar').fadeIn(1000);
});
} else {
jQuery("input[name='profile_submit']").off()
}
});