Question

我目前正在尝试建立一个有三个按钮的网站，一个是Facebook共享一个，另一个是Twitter，另一个链接到视频。它们被归类为“facebook”，“twitter”和“play”。但是，它们都不会转到我在javascript文件中编写的链接。这是我的Javascript文件，以防出现问题：

$(function() {
var clicks = 0;
$('button').on('click', function() {
    clicks++;
    var percent = Math.min(Math.round(clicks / 3 * 100), 100);
    $('.percent').width(percent + '%');
    $('.number').text(percent + '%');
});


$('.facebook').on('click', function() {
    window.open('http://www.facebook.com');

    var w = 580, h = 300,
            left = (screen.width/2)-(w/2),
            top = (screen.height/2)-(h/2);


        if ((screen.width < 480) || (screen.height < 480)) {
            window.open ('http://www.facebook.com/share.php?u=http://bit.ly/somawater', '', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);
        } else {
            window.open ('http://www.facebook.com/share.php?u=http://bit.ly/somawater', '', 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+top+', left='+left);   
        }

});

$('.twitter').on('click', function() {
    var loc = encodeURIComponent('http://bit.ly/somawater'),
            title = "Beautifully innovative all-natural water filters by Soma — ",
            w = 580, h = 300,
            left = (screen.width/2)-(w/2),
            top = (screen.height/2)-(h/2);

        window.open('http://twitter.com/share?text=' + title + '&url=' + loc, '', 'height=' + h + ', width=' + w + ', top='+top +', left='+ left +', toolbar=0, location=0, menubar=0, directories=0, scrollbars=0');
});

$('.play').on('click', function() {
    window.location.href = "http://kck.st/TH0NAN";
});

});

在我的HTML文件中，我通过说

来调用此Javascript文件

<script src="/share/share.js"></script>.

Share.js是javascript的名称。有人能发现可能存在的问题吗？我无法弄明白......

Answer 1

当dom准备就绪时，请检查dom准备好后，页面上是否有您要添加事件的html元素。您可能正在通过其他来源（如ajax或其他可能在dom准备好后发生的其他来源）设置html。

尝试在窗口加载时添加事件：

$(window).on('load',function(){

//Your code to be put here
});

Answer 2

如果事件处理程序在呈现按钮之前运行，则该按钮无法绑定该处理程序。

尝试将您的JS代码放在HTML代码之后，我认为它将按您的意愿运行。

<强>更新

尝试使用：

$('html').on( "click", '.facebook', function() {
  // Do what you want
});

单击时为什么我的按钮没有做任何事情？

2 个答案: