Question

$( function() {
    $( "#save-chart-form" ).submit( function( event ) {
        $("#saveChartButton").prop( 'value', 'Please be patient' );
        // event.preventDefault() // works with this
        // $('#save-chart-form').submit(); // Doesn't work
    } );
} );

单击#saveChartButton时，我在＃save-chart-form表单上运行它。因此，按钮的文字更改为“请耐心等待”。单击按钮时。

除非我发出preventDefault事件，否则这根本不起作用。是否有办法在表单提交上执行任何jQuery操作？我尝试了许多其他解决方案都失败了。此外，我无法$('#save-chart-form').submit()做任何事情，这将是一个解决方案。我使用的是jQuery 3.1.1

编辑：这是一个浏览器问题：它在Firefox上运行正常。如Rory McCrossan所述，Safari在卸载请求后不会处理任何事情。

Answer 1

请勿使用$('#save-chart-form').submit()。这是多余的。

$(function(){
    $("#save-chart-form" ).submit(function(event){
        $("#saveChartButton").prop('value', 'Please be patient');
    });
});

Answer 2

问题是因为在大多数浏览器中，一旦请求卸载页面（即已提交表单），UI将不再更新。解决方法是更改按钮本身的click事件下的按钮文本，而不是submit的{{1}}事件。试试这个：

form

Working example

请注意，更改仅在卸载页面之前的一小段时间内可见。

Answer 3

尝试显示文字＆＃34;请耐心等待＃34;在其他HTML元素而不是#saveChartButton中，因为改变已经提交的表单元素的值可能会混淆js引擎。

e.g。

$("#save-chart-form").submit(function(event) {
    $("#msgBox").html('Please be patient');
});

提交时的Jquery prop值更改不会工作

3 个答案: