Question

我在drupal站点中有一个Web表单，该表单是通过Ajax请求提交的。

在PHP标记中，我显示了一个使用ajax提交的表单，该代码段如下所示：

if(isset($_GET['dev-testing'])) {

  $block = module_invoke('webform', 'block_view', 'client-block-139');
  print render($block['content']);
  ?>
  <div class="unique" style="display: none;">              
    <?php

    print l('Download info pack', render($entry_info), array('attributes' => array('class' => array('btn', 'btn-border hidden-link'), 'target' => '_blank')));?>

  </div>

<?php } ?>

我希望能够在提交表单后将CSS添加到唯一类的div。

尝试过此操作，单击“提交”按钮后无任何作用：

$("button.webform-submit").on('submit', function(){
    $('.unique').css("display", "block");
});

也尝试使用ajaxSend和Complete。没用

$(document).ajaxSend(function() {
     $('.unique').css("display", "block");
});

$(document).ajaxComplete(function(event, request, settings) {
    $('.unique').css("display", "block");
});

我该如何实现？

Answer 1

您可以在表单的按钮上添加一个PreventDefault（）

$('button.webform-submit').on('click', function(e)) {
   e.PreventDefault()
}

这可以防止提交事件的发生。现在，您可以添加更改CSS代码

 $('.unique').css("display", "block");

最后但并非最不重要的一点是，手动提交表单

$('#idForm').submit();

最终代码：

$('button.webform-submit').on('click', function(e)) {
   e.PreventDefault();
   $('.unique').css("display", "block");
   $('#idForm').submit();
}

https://api.jquery.com/event.preventdefault/

https://api.jquery.com/submit/

提交Ajax表单后将CSS添加到元素

1 个答案: