以编程方式点击按钮 - 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

回答

相关问题