Question

我在Drupal 7网站上有一个电子商务“添加到购物车”表单。

我将衣服尺寸显示为单选按钮。

当用户点击一个大小时，我使用jquery添加一个包装类，以便我可以突出显示所选的选项。用户第一次点击大小时，jquery会触发并获得我设置的橙色背景 - 但只是短暂的。我相信一个ajax调用正在刷新控件，它正在失去包装类。再次点击相同的大小会使课程坚持下去。

我的Jquery很简单：

(function($) {
  $(document).ready(function(){
    $('body').on('click','.commerce-add-to-cart .form-radios input',function(){
        $(this.parentNode).removeClass('radio-checked');
        $(this.parentNode).addClass('radio-checked');
    });
  });   
})(jQuery);

所以，我的问题是 - 在ajax被触发后如何重新调用我的jquery函数？是否有一个我不知道的钩子在ajax调用后被触发，或者是否有某种Jquery命令可能有帮助？我已经尝试过.setTimeout，.pause以及其他几个变种而没有成功。

Answer 1

你应该为你的javascript使用drupal行为使用Drupal行为，您的代码将如下所示：

(function ($) {
  Drupal.behaviors.myCustomStuff = {
    attach: function (context, settings) {
      $('body', context).on('click','.commerce-add-to-cart .form-radios input',function(){
        $(this.parentNode).removeClass('radio-checked');
        $(this.parentNode).addClass('radio-checked');
      });
    }
  };
}(jQuery));

基本上，Drupal.behaviors只是Drupal在页面加载或完成ajax调用时会调用的函数列表。

第一个参数发送到函数＆＃34; context＆＃34;是加载的dom，如果你只是加载了页面就是完整的dom，但是如果一个ajax函数刚刚返回一个新表单，那么那个表单dom就是发送为＆＃34; context＆＃34;到功能。

第二个参数发送到函数＆＃34; settings＆＃34;是Drupal.settings js对象，用于将值从php发送到js。

听起来您可能需要javascript in Drupal和this may help with behaviors上的复习。

此外，事件监听器可能无法使用＆＃39; context＆＃39;就像你现在写的一样。
也许改变：

$('body', context).on('click','.commerce-add-to-cart .form-radios input',function(){

到

$('.commerce-add-to-cart .form-radios', context).click(function(){

我上面发布的内容是如何在Drupal 7中正确执行javascript，但我不确定它是否能解决您的问题，因为如果不确切知道您的表单是如何工作的，很难说清楚。
如果您希望根据所选内容对表单的各个部分进行包装并使用ajax，那么最好将这些类添加到form_alter

中的表单组件中

在Drupal ajax update

1 个答案: