問題通過兩個不同的按鈕打開相同的對話框

-3

我一直在努力通過兩個不同的按鈕打開一個對話框，但也許是因爲相同的ID它只顯示第一個按鈕的對話框。你能幫我做另一個按鈕正常工作，所以我可以通過兩個按鈕打開對話框。問題通過兩個不同的按鈕打開相同的對話框

這裏是小提琴。

代碼：

(function() { 
    var dlgtrigger = document.querySelector('[data-dialog]'), 
    somedialog = document.getElementById(dlgtrigger.getAttribute('data-dialog')), 
    dlg = new DialogFx(somedialog); 
    dlgtrigger.addEventListener('click', dlg.toggle.bind(dlg)); 
})();

來源

2014-12-21 Awais Imran

querySelector返回只有一個元素，使用querySelectorAll並通過匹配的元素重複添加事件偵聽器。或者使用jQuery作爲你的標籤暗示它 –

的問題是，document.querySelector('[data-dialog]');只返回的第一個元素中。我已經添加了jQuery，它可以正確地找到它們，並且通過單擊任何按鈕打開對話框。請參閱fiddler。

來源

2014-12-21 19:34:30 fracz

完美！萬分感謝：） –

您可以使用querySelectorAll和遍歷使用for循環中的元素：

(function() { 
    var dlgtrigger = document.querySelectorAll('[data-dialog]'); 

    for (var i = 0; i < dlgtrigger.length; i++) { 
     dlgtrigger[i].addEventListener('click', function() { 
      var somedialog = document.getElementById(this.getAttribute('data-dialog')); 

      console.log('clicked:', this, 'called:', somedialog); 
     }, false); 
    } 
})();

http://jsfiddle.net/742mk702/

來源

2014-12-21 20:12:23 Makaze

問題通過兩個不同的按鈕打開相同的對話框

回答

相關問題