Javascript：腳本沒有在產品着陸頁上快速瀏覽

這是在線商店的情況下，我的問題不完全基於代碼，它更基於理論/概念。我會盡量做到儘可能詳細，但如果有任何模糊之處，我會很樂意進一步說明。Javascript：腳本沒有在產品着陸頁上快速瀏覽

我有兩個例子。第一種是在產品頁面上，當您有主圖片視圖時，以及其下方的縮略圖顯示產品的不同視圖。當您點擊縮略圖時，它會將您在縮略圖中點擊的圖片與主視圖中的圖片進行交換。

第二個示例位於產品着陸頁上，其中smallview圖片具有「快速查看」按鈕，該按鈕彈出顯示產品簡要細節的「快速查看」，主圖片視圖以及縮略圖顯示不同的意見。當您單擊縮略圖時，應該發生與上述相同的操作。它應該將主視圖圖片與您單擊的縮略圖圖片進行交換，但不是。

運行此功能的JavaScript功能齊全。產品頁面和着陸頁都使用同一個，並且它在產品頁面上工作。縮略圖換出，一切正常。但是在着陸頁上，腳本沒有被觸發。

它不會在Chrome的調試器中顯示快速查看的縮略圖上的事件偵聽器，而是在產品頁面的縮略圖上顯示事件。我相信我可能有什麼不對的想法。

該腳本已成功綁定到產品頁面上的縮略圖，因爲產品頁面上的縮略圖顯示在頁面加載上。他們只是在那裏。着陸頁上的快速查看縮略圖在頁面加載時沒有縮略圖，只有當您點擊快速查看按鈕時，它們才「存在」。我將在下面列出一小段代碼，顯示所討論元素的基本結構。

解決此問題的最佳方法是什麼？我需要將eventlistener綁定到快速查看中的縮略圖圖片。

<script type="text/javascript"> 
//<![CDATA[ 
    abcd.picturezoom= Class.create({ 

     initialize: function() { 
      ... 
     }, 

     swap: function (event, elem) { 
      ... 
     }, 

     open: function (event) { 
      ... 
     }, 

     opensub: function (event) { 
      ... 
     }, 

     bindQuickViewPopup: function (event) { 
      ... 
     }, 

     switchModalImage: function (event) { 

     } 

    }); 

    document.observe("dom loaded", function() { 
     picturezoom 
    }); 

    <?php if($isQuickview): ?> 
     ... 
     }); 

    }); 
    <?php endif; ?> 
    //]]>

快速瀏覽和產品頁面HTML：

 <?php foreach ($this->images() as $_image): ?> 

     <a imagenum="<?php ... ?>" 

     data-main-image="<?php ... img?>" 

     href="<?php ... imgfile ?>" 

     class="<?php ... class name ?>" 

     rel=' ... ' 

     id="gallery-thumbnail-quickview"> 

     <img src="<?php ... img?>" 

     width="..." height="..." alt="<?php ... ?>" /></a> 

     <?php endforeach; ?>

我應該如何看待這個問題？在正確的方向上，幾個好的步驟是什麼？編碼部分不是真正的問題，我很難找到從哪裏開始。

來源

2015-07-03 I_Motivate_People

我可以想到兩個解決方案。

而不是立即執行縮略圖初始化邏輯的，它移動到一個稱爲上完整的產品頁面加載並在快速瀏覽層的開口的功能。
使用委託事件處理程序在執行腳本時確實存在的鏈中較高的某處。

代表團是快速使用jQuery：

$(document).on('click.thumbnail', 'a.thumbnail_link', function(e){ 
    ... 
});

你可以建立委託事件處理在普通的JavaScript，太：DOM Event Delegation without jQuery

如果init邏輯需要特定的產品，你的信息可以從單個頁面打開多個QuickView圖層，因爲通常情況下，第一個解決方案可能更可取。

來源

2015-07-03 13:42:01

只是擡起頭，你的鏈接404'd –

URL是固定的，謝謝。 –

Javascript：腳本沒有在產品着陸頁上快速瀏覽

回答

相關問題