缓存中断功能? -- javascript 领域 和 caching 领域 drupal 相关 的问题

Cache breaks functionality?


0
vote

问题

中文

我已经添加了一些jQuery功能,以创建一个弹出弹出窗口,当时我正在使用的特定主题所包含的脚本。它括在 jQuery(document).ready(function($) {} 中。

它首先工作完全相同,但似乎曾经是drupal 7缓存/汇集脚本.js文件,它根本不再适用。我不是100%确定它是一个缓存相关问题,因为它适用于几个小时,但最终停止工作。在停止工作后清除CSS / JS缓存使其再次工作。

  function contactLinkInit() {         var div = '<div class="contact-popup">' +                 '10320 Globe Road<br/>Morrisville, NC 27560<br/>' +                 'Phone: <a href="tel:919-361-4333">919-361-4333</a><br/>' +                 'Fax: 919-361-4388<br/>' +                 '<a href="mailto:info@dosoffice.com">info@dosoffice.com</a>';          var firstRun = true;         var firstEntered = true;         var enteredPopup = false;          $("a.contact-link").mouseover(function(event) {             if (firstRun) {                 $("body").append(div);                   $("div.contact-popup").mouseover(function() {                     if (!firstEntered) {                         enteredPopup = true;                     }                     else {                         firstEntered = false;                     }                      $("div.contact-popup").css('visibility','visible');                  });                  $("div.contact-popup").mouseout(function() {                     enteredPopup = false;                      $("div.contact-popup").css('visibility','hidden');                    });                  $("a.contact-link").mouseout(function() {                     if (!enteredPopup) {                         $("div.contact-popup").css('visibility','hidden');                      }                    });                 firstRun = false;             }             $('div.contact-popup').css('left',event.pageX + "px");      // <<< use pageX and pageY             $('div.contact-popup').css('top',event.pageY + "px");                $("div.contact-popup").css('visibility','visible');          });     }      contactLinkInit();   

我确定我在这里所做的是不是最好的练习,既不是javascript和drupal都是我的强项。不仅我正在寻找解决问题本身的解决方案,我当然不介意建议如何改进代码本身。

英文原文

I have added some jQuery functionality to create a popup when hovering over a link to the script.js file included with the particular theme I am using. It is enclosed in jQuery(document).ready(function($) {}.

It works perfectly at first, but it seems that once Drupal 7 caches/aggregates the script.js file, it no longer works at all. I'm not 100% sure it is a caching related issue, as it works fine for hours, but eventually stops working. Clearing the CSS/JS cache after it stops working makes it work again.

function contactLinkInit() {         var div = '<div class="contact-popup">' +                 '10320 Globe Road<br/>Morrisville, NC 27560<br/>' +                 'Phone: <a href="tel:919-361-4333">919-361-4333</a><br/>' +                 'Fax: 919-361-4388<br/>' +                 '<a href="mailto:info@dosoffice.com">info@dosoffice.com</a>';          var firstRun = true;         var firstEntered = true;         var enteredPopup = false;          $("a.contact-link").mouseover(function(event) {             if (firstRun) {                 $("body").append(div);                   $("div.contact-popup").mouseover(function() {                     if (!firstEntered) {                         enteredPopup = true;                     }                     else {                         firstEntered = false;                     }                      $("div.contact-popup").css('visibility','visible');                  });                  $("div.contact-popup").mouseout(function() {                     enteredPopup = false;                      $("div.contact-popup").css('visibility','hidden');                    });                  $("a.contact-link").mouseout(function() {                     if (!enteredPopup) {                         $("div.contact-popup").css('visibility','hidden');                      }                    });                 firstRun = false;             }             $('div.contact-popup').css('left',event.pageX + "px");      // <<< use pageX and pageY             $('div.contact-popup').css('top',event.pageY + "px");                $("div.contact-popup").css('visibility','visible');          });     }      contactLinkInit(); 

I'm sure what I've done here is not best practice, neither Javascript nor Drupal are my forte. Not only am I looking for a solution to the problem itself, I certainly wouldn't mind suggestions as how to improve the code itself.

     
         
         

回答列表

0
 
vote
vote
最佳答案
 

我已经在评论中拨出了我的代码,以便它使用Drupal行为和Drupal的JavaScript-API。我还将我的代码从现有的主题的 998876615 转移到自己的文件中,并将该文件添加到主题的 $form['#submit'][] = array('mymodule_form_followbtn_custom_submit'); 6 文件中的脚本数组。

下面是我的更新代码,以防它应该帮助任何遇到这种相同问题的人,并且不熟悉Drupal行为。这已经解决了我的问题,我的代码一旦汇总和/或缓存了一旦js被汇总并且〗。

  $form['#submit'][] = array('mymodule_form_followbtn_custom_submit'); 7  
 

I have redone my code as suggested in the comments so that it uses Drupal behaviors and the Drupal's javascript-api. I also moved my code out of the existing theme's script.js to its own file, and added that file to the scripts array in the theme's .info file.

Below is my updated code, in case it should help anyone that encounters this same sort of problem and is unfamiliar with Drupal behaviors. This has solved my problem with my code no longer working once the JS is aggregated and/or cached.

   (function($) {      Drupal.behaviors.contactLinkHoverPopout = {          attach: function(context, settings) {              var div = '<div class="contact-popup">' +                  '10320 Globe Road<br/>Morrisville, NC 27560<br/>' +                  'Phone: <a href="tel:919-361-4333">919-361-4333</a><br/>' +                  'Fax: 919-361-4388<br/>' +                  '<a href="mailto:info@dosoffice.com">info@dosoffice.com</a>';               var popupVisible = false;               // we only want mouseovers applied once!                 $('a.contact-link', context).once(function() {                  // add the invisible popup div                  $('body', context).append(div);                   // add mouseover to contact-link                  $('a.contact-link', context).mouseover(function() {                      $('div.contact-popup', context).css('left', event.pageX + "px");                      $('div.contact-popup', context).css('top', event.pageY + "px");                      $('div.contact-popup', context).css('visibility', 'visible');                      popupVisible = true;                  });                   $('div.contact-popup', context).mouseover(function() {                      $('div.contact-popup', context).css('visibility', 'visible');                      popupVisible = true;                  });                   $('a.contact-link', context).mouseout(function() {                      if (popupVisible) {                          $('div.contact-popup', context).css('visibility', 'hidden');                          popupVisible = false;                      }                  });                   $('div.contact-popup', context).mouseout(function() {                      if (popupVisible) {                          $('div.contact-popup', context).css('visibility', 'hidden');                          popupVisible = false;                      }                  });              });          }      };  }(jQuery)); 
 
 

相关问题

1  Colorbox Gallery带媒体字段  ( Colorbox gallery with media field ) 
我正在寻找一种方法(在d8中)为具有多个图像的节点字段创建Colorbox库,但我面临以下问题: colorbox只适用于图像字段格式化器(无媒体字段格式化器)。 我更喜欢媒体字段,因为它很高兴有实体浏览器来重用一些图像。 尝试创建一个使用实体浏览器收集图像的图像字段,对我不起作用。我收到错误"实体必须是文件" ...

1  如何在Page.html.twig中使用jQuery?  ( How do i use jquery in page html twig ) 
在drupal 7中,我使用了一些javascript,在page.tpl.php文件中使用以下代码。 <script type="text/javascript"> (function($) { $( ".mobile-menu-button" ).click(function() { ...

1  如何将光标添加到页面加载上的文本字段? [关闭]  ( How to add cursor to text field on page load ) 
此问题似乎在帮助中心中定义的范围内涉及Drupal。。 想要改进这个问题?更新问题,所以它是关于drupal答案的主题。 ...

1  由于多个模块而影响UI的视图  ( Views ui affected due to multiple modules ) 
jquery.once是完美的,我放在它里面的控制台,但仍然特别是当我在按下任何按钮之前加载ui时,仍然会收到此错误 当我按任意按钮时,将出现进度动画,再次出现此错误 <?php namespace Drupalmy_modulesPluginBlock; use DrupalCoreBlockBlockB...

0  生产服务器上的jQuery错误  ( Jquery error on the production server ) 
我们有一个带有链接模块的奇怪错误。 我们在witymce上安装了Wisywig的Drupal 7网站上的Linkit。在本地和暂存环境中,它可以完美地工作,但在不同的服务器上的生产环境中,Linkit的模态是空的,我们有错误JavaScript: TypeError: $(...).once is not a f...

0  从Drupal语言切换器更改语言时,JS元素的更改语言?  ( Change language of a js element when language has been changed from drupal langu ) 
首先,抱歉真正令人困惑的头衔,但我不知道如何让它更友好。 在我的网站上,有三种语言:英语,芬兰和瑞典语。用户可以从默认的Drupal语言切换器之间更改这些语言。 现在网站的关键部分来自我认为在js中的API。 js元素有自己的语言更改参数。 src ="// www.websiteofapi.com/alppor...

1  将逻辑添加到页面[已关闭]  ( Adding logic to a page ) 
关闭。这个问题需要更多聚焦。它目前不接受答案。 想要改进这个问题?更新问题,因此它仅拍摄了一个问题,只有编辑此帖。 关闭 3年前。 ...

0  核心jquery不在自动启动主题中工作  ( Core jquery not working in bootstrap theme ) 
我正在使用bootstrap 3个子上和drupal 8.由于我添加依赖性核心/ jQuery时,它会出现不起作用。我做错了什么? mysubtheme: css: theme: css/slippry.css: {} header: true js: js/s...

4  为什么我应该为我的模块的javascript文件使用什么包装器?  ( Why and what wrapper should i use for my modules javascript file ) 
我为我的模块定义了d3.js脚本: test: js: js/test.js: {} dependencies: - mymodule/d3 - core/drupalSettings d3: remote: https://d3js.org version: "4.x" ...

2  如何使用单击绘制谷歌地图创建新标记?  ( How to create new markers into a google map with click ) 
我想在单击事件上添加标记,并将其添加到确切的位置,其中用户点击地图。 不能使用最终返回任何内容的任何官方示例。 我当前的模块特定的JS代码如下(只是尝试逐步构建它): (function ($) { Drupal.behaviors.gmapPage = { attach: function(cont...

0  行为功能无法识别  ( Behavior function not recognized ) 
我想要 https://github.com/dynamick/multiple-filter-masonry加载ropal方式。 但我失败了,这是我的代码: (function ($) { Drupal.behaviors.druckgott = { attach: function (context,se...

0  在特定内容类型中添加JS依赖jQuery  ( Add js depend jquery in a specific content type ) 
我需要在特定内容类型上使用jQuery语法添加JS文件。 我尝试了twig模板,但我得到 998876669 , 如果我只有js本机语法,它就会很棒,但不是jQuery语法。 我认为这不是添加js依赖jquery文件到特定页面的正确方法。 我想知道,什么是正确的方法? 非常感谢。 ...

0  如何显示WebForm提交页面弹出?  ( How to show the webform submission page as pop up ) 
我已使用两个字段创建了WebForm。当我提交WebForm时,它将重定向到提交页面。 现在,我想显示WebForm提交页面,弹出。 谢谢您的消息,"返回表格" 应在弹出窗口中显示。 我已经尝试过ng灯箱以显示消息。但它通过弹出功能重定向到页面。 如何实现这件事,请指导我。 ...

1  如何解决jQuery / Ajax问题的问题?  ( How do i troubleshoot a jquery ajax issue ) 
在当前的Drupal Commerce安装上,我刚刚开始在jQuery Click事件之后遇到字段未更新的问题。 当用户选择一个选项时,价格通常会更新我们商店上的几个产品。将物品添加到购物车时,显示了正确的价格。 (虽然在我的目的上有所帮助,但客户正在收取合适的价格,但他们看不到正确的价格并不伟大,直到它在购物车。...

-1  无头耳伞8和角度的结构[关闭]  ( Structure for headless drupal 8 and angular ) 
关闭。这个问题需要详细信息或清晰度。它目前不接受答案。 想要改进这个问题?添加详细信息并阐明编辑此帖的问题。 关闭 12个月前。 ...

1  如何正确地将Google AMP .js文件添加到我的主题上  ( How to correctly add google amp js files to my theme ) 
我正在使用drupal 7 中的Drupal放大器模块,主题和库 我正在使用这里的AMP验证工具 vervator.ampproject.org 我有amp-filebar工作正常,除了javascript导致错误。 添加放大器内部JS文件时,我在验证时得到以下错误。 <script async custom...

0  如何在jquery上使用超过2个版本?  ( How to use more than 2 versions on jquery ) 
我想使用bootstrap主题,它需要jQuery 1.9,但是当我设置1.9时,启用Ajax的视图不起作用。我正在使用意见3.14。很少有Contract模块需要旧版本的jQuery。所以在jquery_update中,我可以为管理页面和1.7为网站设置"默认drupal" 。 如何获得1.9对我的网站没有冲突? ...

0  我的JavaScript函数如何从Google Analytics模块中访问Web属性ID?  ( How can my javascript function access the web property id from the google analyt ) 
我使用 Googleanalytics 模块在我的大多数项目中,并且通常是相同的问题: 由于我的国家的政策要求,每个用户都必须能够停用Google-Analytics cookies 。为此,我需要一个小javascript来禁用cookie wich包含由模块提供的UA /属性ID。 normaly这样的配...

1  使用#states数组在空的选择字段上的动态表单字段  ( Dynamic form fields using states array on empty select field ) 
尝试在第一个控制器字段中存在值时仅显示第二个字段。如果在屏幕的初始负载中选择了任何内容,则应隐藏第二个字段。 因为控制器API_title是一个子数组,我不确定如何在条件名称='api_title'中设置比较值 $form['api_title_filter_widget'] = array('#tree' =...

0  如何将页面路径更改为Google Analytics作为PageView  ( How to change the page path being reported to google analytics as a pageview ) 
我希望某个页面路径报告为不同的页面路径,如果它有一个哈希值。 /page-name#hash-name 应该报告为 /page-name/hash-name 是在Google Analytics模块中,如果我将此添加到自定义JS: ga('send', 'pageview', '/page...




© 2021 it.wenda123.org All Rights Reserved. 问答之家 版权所有


Licensed under cc by-sa 3.0 with attribution required.