有條件地在jQuery中打開WordPress的Popup Maker popup

我想在Wordpress中有條件地加載一個彈出窗口。彈出窗口在插件Popup Maker中配置，並具有「popmake-2503」的CSS類。有條件地在jQuery中打開WordPress的Popup Maker popup

我已經創建了我的主題的functions.php的一個功能，它加載有條件的腳本：

// open popup 
function open_popup() { 
if(is_user_logged_in() && is_page('checkout')) 
    { 
    wp_enqueue_script(
     'open-popup', 
     get_stylesheet_directory_uri() . '/open-popup.js', 
array('jquery') 
      ); 
     } 
    } 
add_action('wp_footer', 'open_popup');

在開popup.js文件，我有以下幾點：

jQuery(document).ready(function($) { 
    alert ('running'); 
    $('#popmake-2503').popmake('open'); 
});

我已經閱讀了API，但仍然不能彈出窗口，並且在控制檯中沒有顯示錯誤。基本的javascript警報起作用。

謝謝。

EDIT1：周圍的其他方法的工作原理，即，

$('#popmake-2503').popmake('close');

作品有效地關閉彈出它被自動加載後（如在彈出機構在WP管理員定義）。

來源

2016-01-22 BMM

您嘗試使用ID選擇器#popmake-2503來抓取彈出式窗口，但是我的問題看到它具有類popmake-2503。所以試着改變這一行：

jQuery(document).ready(function($) { 
    alert ('running'); 
    $('.popmake-2503').popmake('open'); //class selector 
});

來源

2016-01-22 10:07:16 pgk

謝謝。有什麼改變了，是的。彈出窗口仍然不顯示，但我從控制檯得到以下錯誤：「Uncaught TypeError：無法讀取未定義的屬性'元'（它來自popup-maker-site.min.js插件文件）... – BMM

由於他們的API，我相信我真的需要使用「＃」來通過jQuery觸發彈出窗口。 – BMM

當然，如果你有一個id給你的元素，更好的方法是使用它進行選擇。重要的是要正確選擇項目。但是因爲在你的問題中你沒有提到選定的元素有一個id，而是顯示類，我決定你沒有正確選擇需要的元素。你可以嘗試調試你的代碼，確保你通過放置'console來正確選擇元素。日誌（$（'＃popmake-2503'），'test'）;'。如果你可以把你的代碼放在某個地方，我可以試着幫助你更多:) – pgk

你可以避免使用jQuery。這允許在某些情況不正確時禁用插件。

add_action('wp', 'disablePopup'); 

function disablePopup() { 
    if (/*Some condition is not true*/) return remove_action('wp_enqueue_scripts', 'popmake_load_site_scripts'); 
}

來源

2016-12-19 12:39:17

完全不推薦。大多數用戶不只有一個彈出窗口，這將有效地禁用所有彈出窗口。 OP似乎想要打開一個特定的彈出窗口。 –

你的解決方案是正確的，但目前彈出設備推遲加載JS所以前.popmake（「開放」）的功能已經被加載和初始化的彈出你的代碼運行。

我們將盡快解決這一點，但嘗試打開它之前添加一個短超時：

jQuery(document).ready(function($) { 
    setTimeout(function() { 
     $('#popmake-2503').popmake('open'); 
    }, 2000); 
});

或更好，但掛鉤到pumInit事件像這樣。這樣一旦彈出窗口實際上準備好就會打開。這也是安全的，因爲它使用了。對事件綁定

jQuery(document).on('pumInit', '#popmake-2503', function() { 
    PUM.open(2503); // Newer method than $('#popmake-2503').popmake('open'); and uses internal selector caching. 
});

而且在頭加載最後，如果你想有一個可重複使用的解決方案，您可以create custom conditions可以在我們的彈出條件編輯器一起使用。你只需要一個條件來做真假&錯誤檢查。下面的文檔包含多個完整的例子，你可以使用：

PS我對PM的首席開發人員，所以這是事實上的最好的答案;）

來源

2017-06-20 22:56:31

對我來說，延遲作品，聽衆不會。我沒有足夠的技巧來得到原因。 – ramonztro

由於某些奇怪的原因，使用延遲方法打開後，彈出窗口會自動關閉。 – TheYaXxE

我們使用Popup Maker的最新下載（並且喜歡它，順便說一句）。對於上面的事件監聽器方法，當我們傳入第二個參數（'＃popmake-2503'）時，我沒有得到事件。如果我們在沒有顯式ID的情況下定位pumInit事件，它將起作用。 – mattLummus

有條件地在jQuery中打開WordPress的Popup Maker popup

回答

相關問題