JS自动点击不起作用答案

【问题标题】：JS automated click not workingJS自动点击不起作用
【发布时间】：2017-09-08 10:44:05
【问题描述】：

编辑：

我想我已经找到了解决方案。可能有点原始，但在有人提出更好的解决方案之前将其插入此处。

谢谢！

<html>
<body onload="makeShort()">

<p id="button" style=display:none; onclick="makeShort()">Click me.</p>


 
<span id="output" style=display:none; >Wait. Loading....</span>

 
</body>
<head>
</head>
<script type="text/javascript">


function makeShort() 
{
   var longUrl=location.href;;
    var request = gapi.client.urlshortener.url.insert({
      'resource': {
      'longUrl': longUrl
    }
    });
    request.execute(function(response) 
    {
 
        if(response.id != null)
        {
            str =""+response.id+"";
            document.getElementById("output").innerHTML = str;
        }
        else
        {
            alert("error: creating short url n"+ response.error);
        }
 
    });
 }
 window.onload = makeShort;
 
function load()
{
    //Get your own Browser API Key from  https://code.google.com/apis/console/
    gapi.client.setApiKey('xxxxxx');
    gapi.client.load('urlshortener', 'v1',function(){document.getElementById("output").innerHTML="";});
 
}
window.onload = load;
</script>

<script>
setTimeout(function(){
    	document.getElementById('button').click();
       },1000);
</script>



<script src="https://apis.google.com/js/client.js"> </script>
 

</html>




<html lang="en">
    <head>
        <meta charset="utf-8">
        <title></title>
        <script>
            function SendLinkByMail(href) {
                var subject= "Interesting Information";
                var body = document.getElementById("output").innerHTML;
                body += " Interesting Information";
                var uri = "mailto:?subject=";
                uri += encodeURIComponent(subject);
                uri += "&body=";
                uri += encodeURIComponent(body);
                window.open(uri);
            }
        </script>
    </head>
    <body>
        <p><a href="javascript:(function()%7BSendLinkByMail()%3B%7D)()%3B">Email link to this page</a></p>
    </body>
</html>

有人能指出为什么这个“自动点击”功能在我下面的代码中不起作用吗？

    function makeShort() {
    var longUrl = location.href;;
    var request = gapi.client.urlshortener.url.insert({
        'resource': {
            'longUrl': longUrl
        }
    });
    request.execute(function(response) {

        if (response.id != null) {
            str = "<b>Long URL:</b>" + longUrl + "<br>";
            str += "<b>Short URL:</b> <a href='" + response.id + "'>" + response.id + "</a><br>";
            document.getElementById("output").innerHTML = str;
        } else {
            alert("error: creating short url n" + response.error);
        }

    });}    window.onload = function() {
    var button = document.getElementById('modal');
    button.form.submit();}    
    function load() {
    //Get your own Browser API Key from  https://code.google.com/apis/console/
    gapi.client.setApiKey('xxxxxxxxx');
    gapi.client.load('urlshortener', 'v1', function() {
        document.getElementById("output").innerHTML = "";
    });}   window.onload = load;

<html>

<input type="button" id="modal" value="Create Short" onclick="makeShort();" /> <br/> <br/>

<div id="output">Wait. Loading....</div>
 
<head>
</head>

<script src="https://apis.google.com/js/client.js"> </script>
</html>

我的基本目标是在页面上插入一个“通过电子邮件共享”按钮，这将缩短地址栏上的 url 并打开用户的电子邮件客户端/whatsapp 应用程序以共享该 url..

显然我找不到将这两个功能合二为一的方法，因为我不是一个非常有经验的 js 人。我找到的原始解决方案是自动单击第一个函数，获取短 url，然后找到不同的代码将其插入到“mailto”链接的正文中，这将是我的第二个挑战。

【问题讨论】：

是什么让您认为它不起作用？
如果您单击按钮，则 url 缩短器正在工作，但我希望在页面加载时自动单击按钮，这不会发生
我看不到任何与自动单击按钮相关的代码

标签： javascript triggers automation

【解决方案1】：

以编程方式在页面加载时单击按钮

如果您使用的是 jQuery：

$(function() {
    $('#modal').click();
});

纯javascript：

window.onload = function(){
    var event = document.createEvent('Event');
    event.initEvent('input', true, true);
    document.getElementById("modal").dispatchEvent(event);
 };

【讨论】：

我认为这不起作用，因为我的 js 中可能已经有不同的 onload 函数？
是的。在您的 window.onload 函数中，您正在调用按钮上的提交。但是，您要运行的函数 makeShort() 被放置在 onClick 处理程序中...要使其以您想要的方式工作，只需更改您调用提交到我发布的代码的位置即可调用一次点击
我有点不确定你为什么要这样做。为什么不直接在页面加载时调用makeShort() 并像你已经拥有的那样将它绑定到按钮单击？自动点击按钮似乎是错误的