模擬鼠標點擊下拉菜單

我的WordPress主題與WooCommerce交互，因此當用戶從下拉菜單中選擇特定的產品變量時，會顯示其區域的特定價格。模擬鼠標點擊下拉菜單

這工作正常，當用戶手動選擇下拉，但是，我試圖通過基於瀏覽器cookie（或缺少一個）爲用戶預先選擇適當的選項來加速該過程。

例如，如果用戶還沒有進入他們的區域他們的瀏覽器將不會有我命名「PC-進入」和下面的jQuery腳本將運行的cookie：

$(function() { 
    $('ul li.product').each(function() { 
     /*If no region set by cookie*/ 
     if(document.cookie.indexOf("pc-entered=") < 0) { 
      /*Set downdown to generic*/ 
      $(this).find("#pa_region").val('generic'); 
     } 
    }); 
});

這工作，自動成功預先選擇正確的「通用」下拉選項。

不幸的是，這是我卡住的地方 - 雖然下拉是正確的，但價格並不像自動填充區域時那樣自動填充。

E.g.

1）當使用我的腳本自動填充：

2）當用戶選擇：

我試着在我的腳本替換這個：

$(this).find("#pa_region").val('generic');

然而，在this thread上列出的選項，它們在這種情況下似乎不起作用。我也嘗試在頁面上的所有其他腳本之後觸發腳本，甚至延遲腳本運行超時功能，但似乎沒有任何工作。

我的測試網站是here。

TLDR -爲什麼我的jQuery腳本沒有填充價格？

來源

2017-06-06 Dan382

隨着$(this).find("#pa_region").val('generic');你只是改變下拉的HTML值（文本）。

您需要將觸發更改的事件處理程序附加到更改值的函數。

function changeValue(){ 
    $("#pa_region").val('generic'); 
    $("#pa_region").trigger('change'); 
} 

$("#pa_region").change(function() { 
    console.log("Handler for .change() called."); 
});

這是如何解決它的方法。

我也做了JSFiddle所以你可以測試它。

來源

2017-06-06 16:57:23 Dino

感謝你的理解，我只是在改變HTML。快速的問題，在你的JSFiddle中，通過點擊按鈕來觸發該功能。如何在頁面加載時觸發該功能，同時保留現有的每個功能？ – Dan382

如果我正確地理解了你，你可以在document.ready函數中添加觸發器。 https://jsfiddle.net/2rkkb3jh/4/ – Dino

模擬鼠標點擊下拉菜單

回答

相關問題