以編程方式點擊按鈕 - JS

我已經在其他webapps中看到了這一點，但我對Javascript很新，並且無法真正瞭解我自己。我想以編程方式創建Google Hangout。但是，在官方API中，您可以創建環聊的唯一方式是在你的頁面上添加環聊按鈕。以編程方式點擊按鈕 - JS

Here's the Google doc on the Hangouts button.

我想要做的是有一個用戶點擊其他用戶的IMG，打開視頻羣聊這種方式。看起來我可以捕獲該點擊，然後在後臺點擊環聊按鈕。但是，我對JavaScript不太好，所以我不知道如何實現這一點。

編輯

我試着下面的mohamedrais的解決方案沒有運氣。這與按鈕的類有關嗎？

這裏的按鈕的代碼，用Hangouts文檔與添加id採取：

<script type="text/javascript" src="https://apis.google.com/js/platform.js"></script> 
     <div class="g-hangout" id="hangout-giLkojRpuK" 
           data-render="createhangout"> 
     </div>

這裏的JS我加入其中，id小號呈現：

 <script> 
      window.onload = function() { 

       var userImage = document.getElementById("img-giLkojRpuK"); 
       var hangoutButton = document.getElementById("hangout-giLkojRpuK"); 

       userImage.onclick = function() { 

       console.log("in onclick"); 
       hangoutButton.click(); // this will trigger the click event 
       }; 
      }; 
     </script>

當我點擊img，「onclick」正在被記錄，所以函數被調用。但是，沒有任何反應 - 環聊未啓動。

當我直接點擊環聊按鈕時，它確實會啓動環聊。但是，我想最終隱藏這個並從圖像中執行點擊。

這裏的視頻羣聊按鈕img上面的圖片：

enter image description here

來源

2014-06-18 Ramsel

@MuhammadSaifullah：jQuery的_is_的JavaScript。這是一個Javascript庫。您的建議很有價值，但請不要混淆這些條款。 – pixelistik

@MuhammadSaifullah簡單事件處理並不需要Jquery。只有當你正在做大量的DOM操作等，我覺得jQuery的將是一個更好的選擇，因爲它提高了工作效率和照顧瀏覽器兼容性 – mohamedrias

@Ramsel的是你永遠能夠想出解決辦法？我遇到了同樣的問題。似乎無法觸發環聊API呈現的此按鈕的點擊。 – LNA

window.onload = function() { 
    var userImage = document.getElementById('imageOtherUser'); 
    var hangoutButton = document.getElementById("hangoutButtonId"); 
    userImage.onclick = function() { 
     hangoutButton.click(); // this will trigger the click event 
    }; 
};

這將這樣的伎倆

來源

2014-06-18 06:34:13 mohamedrias

你的代碼在第5行有一個錯字：變量名是'hangoutButton'而不是'handoutButton'。 –

我試過這個解決方案，但沒有運氣。看到我上面的編輯。這是否與環聊的「按鈕」形式有關？ – Ramsel

我認爲這個解決方案取決於是否有一個jQuery庫，這就是爲什麼@Ramsel嘗試沒有運氣。 –

儘管這個問題是比較舊的，這裏有一個答案:)

你所要求的可以通過使用jQuery的.click() event method 和.on() event method

所以這可能是代碼：

// Set the global variables 
var userImage = $("#img-giLkojRpuK"); 
var hangoutButton = $("#hangout-giLkojRpuK"); 

$(document).ready(function() { 
    // When the document is ready/loaded, execute function 

    // Hide hangoutButton 
    hangoutButton.hide(); 

    // Assign "click"-event-method to userImage 
    userImage.on("click", function() { 
     console.log("in onclick"); 
     hangoutButton.click(); 
    }); 
});

來源

2016-05-03 19:46:08 AnthyG

我從來沒有與HANGOUT發展。我遇到了與FB登錄相同的問題，我試圖很難讓它以編程方式點擊。然後，後來我發現，由於某些安全原因，sdk不允許您以編程方式點擊該按鈕。用戶必須物理地點擊按鈕。這也發生在async asp fileupload按鈕上。因此，請檢查HangOut是否允許您以編程方式點擊按鈕。以上所有代碼都是正確的，他們應該工作。如果你深入挖掘，你會發現我的回答是你的情況的正確答案。

來源

2017-11-12 08:56:56

你明白事件處理程序是什麼嗎？這是一個功能。你知道瀏覽器在調用這個函數時做了什麼嗎？它發送一個「Event」對象作爲唯一的參數。你明白事件對象是什麼嗎？不同的瀏覽器可能略有不同，但本質上它們只是一個對象，其「目標」是DOM引用某些用戶所做的某些元素。

如果目標是以編程方式做某件事，那麼通常你只關心發生了什麼事情，而不是什麼細節，而且你已經知道它發生在哪裏以及在那裏會發生多少事情。因此，您可以完全忽略事件本身，然後嘗試手動調用事件處理程序：handleFoo();。

如果你確實需要的目標屬性，只要抓住與document.getElementById('someId')一個DOM參考，並傳遞？因此，像：

var elem = document.getElementById('foo'); 
handleFoo({ target: elem });

好吧，也許API嚴格執行和檢查instanceof或原型鏈。但即便如此，即使你沒有構造函數，爲什麼不寫一個呢？在它中，你使用Object.create手動擺弄所有的對象創建工具？即請將__prototype__設置爲MouseEventPrototype，並確保從目標瀏覽器中深度複製儘可能多的屬性，以便通過對任何API的審查？我懷疑API正在做一些深入檢查以確保有效性，或者甚至API甚至可以檢測到這樣的事情。

如果瀏覽器本身防止相象對象的創建，那麼也許攔截並保存到一些其他類似的事件對象的引用，修改你需要什麼樣的屬性，如果有的話，那傳遞下去？瀏覽器可能會阻止使用只讀屬性？

如果有的像jQuery庫是能夠做到這一點，那麼他們證明了它是可能的。 jQuery不是一些提升的魔法。這只是某人輸入的JavaScript，與您輸入自己的內容相同。只是看看他們的代碼，並確定他們使用的技術，並做類似的事情？

如果我們到達這裏一路下跌並沒有什麼的工作，然後確定，然後我卡住了，瀏覽器的安全性已經鎖定到一個合理的程度。 ;）

來源

2017-11-17 15:54:59 user314159

以編程方式點擊按鈕 - JS

回答

相關問題