Fatal编程技术网
  • javascript/
  • Javascript windows.location不处理单击事件

Javascript windows.location不处理单击事件

javascript jquery

Javascript windows.location不处理单击事件,javascript,jquery,Javascript,Jquery,我有点问题，点击事件不能正常触发。我提到的点击事件是附在#sales页面底部的事件。我使用microsoft.com只是为了确保它不是我试图导航到的页面。任何帮助都将不胜感激，代码如下 // JavaScript Document $(document).ready(function() { $(".intro-no-js").css("visibility","hidden"); $(".intro-javascript").css("visibility","visible"); //

我有点问题，点击事件不能正常触发。我提到的点击事件是附在#sales页面底部的事件。我使用microsoft.com只是为了确保它不是我试图导航到的页面。任何帮助都将不胜感激，代码如下

// JavaScript Document

$(document).ready(function() {

$(".intro-no-js").css("visibility","hidden");
$(".intro-javascript").css("visibility","visible");

//defines how max should be animated
jQuery.fn.maxanimate = function () { 
this.css("position","absolute"); 

    var t = (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop(); 

    var l = (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft(); 

    $(this).animate({
        top: t,
        left: l-79.5
    }, 500);

    return this; 
} 


//defines how xim should be animated
jQuery.fn.ximanimate = function () { 
this.css("position","absolute"); 

    var t = (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop(); 

    var r = (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft(); 

    $(this).animate({
        top: t,
        left: r+78.5
    }, 500);

    return this; 
} 

//defines how top arrows should be animated
jQuery.fn.arrowsanimate = function () { 
this.css("position","absolute"); 

    var t = (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop(); 
    var l = (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft(); 

    $(this).animate({
        top: t-25,
        left: l
    }, 500);

    return this; 
} 

//defines how bottom section should be animated
jQuery.fn.animatebottom = function () { 
this.css("position","absolute"); 

    var b = (($(window).height() - this.outerHeight()) / 2) + $(window).scrollTop(); 
    var l = (($(window).width() - this.outerWidth()) / 2) + $(window).scrollLeft(); 

    $(this).animate({
        bottom: b-22,
        left: l
    }, 500);

    return this; 
}

//max starting co-ordinates
var maxl = $(window).width() - 157; 
var maxt =  ($(window).height() - $("#intro-max").outerHeight()) / 2; 

//xim starting co-ordinates
var ximr = $(window).width() - 159; 
var ximt = ($(window).height() - $("#intro-xim").outerHeight()) / 2; 

//arrows starting co-ordinates
var al = (($(window).width() -  $("#intro-xim").outerWidth()) / 2) + $(window).scrollLeft()+ 35; 
var at = 0; 

//bottom of logo starting co-ordinates
var bl = (($(window).width() -  $("#intro-xim").outerWidth()) / 2) + $(window).scrollLeft()-50;
var bt = 0;

//set initial co-ordinates for all divs
$("#intro-arrows").css({position: "absolute",top: at,left: al});    
$("#intro-max").css({position: "absolute",top: maxt,right: maxl});
$("#intro-xim").css({position: "absolute",top: ximt,left: ximr});
$(".intro-bottom").css({position: "absolute", bottom: bt, left: bl});

//lets bring it all to life!
$("#intro-max").maxanimate();
$("#intro-xim").ximanimate();
$("#intro-arrows").arrowsanimate();
$(".intro-bottom").animatebottom();



$("#sales").click(function() {
    window.location = "http://www.microsoft.com"; 
});

});
我的标记如下：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Maxxim - Welcome</title>
</head>
<script type="text/javascript" language="javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript" language="javascript" src="js/intro.js"></script>
<link rel="stylesheet" type="text/css" href="css/intro.css">
<body>
<div class="intro-no-js">
<img src="imgs/intro/Intro-logo.gif" alt="Maxxim Logo">
<a href="sales-and-marketing.html" title="Sales & Marketing"><img src="imgs/intro/Intro-sales-butt.gif" alt="Sales & Marketing" id="sales"></a>
<a href="design.html" title="Design"><img src="imgs/intro/Intro-design-butt.gif" alt="Design" id="design"></a>
</div>

<div class="intro-javascript">
<div id="intro-arrows"></div>
<div id="intro-max"></div>
<div id="intro-xim"></div>

<div class="intro-bottom">
    <div id="pants"></div>
    <div id="sales"></div>
    <div id="design"></div>
</div>
</div>

</body>
</html>
试试这个

$("#sales").click(function() {
    window.location.href = "http://www.microsoft.com"; 
    return false;//Just in case if it is a link prevent default behavior
});
查看您提供的链接，我发现了问题。您对页面上的多个元素具有相同的ID。因此，当您尝试按id获取元素时，如果页面上有多个元素，jQuery将返回具有该id的第一个元素

您的
页面上也有相同id的
sales
。更改id应该可以正常工作。

试试这个

$("#sales").click(function() {
    window.location.href = "http://www.microsoft.com"; 
    return false;//Just in case if it is a link prevent default behavior
});
查看您提供的链接，我发现了问题。您对页面上的多个元素具有相同的ID。因此，当您尝试按id获取元素时，如果页面上有多个元素，jQuery将返回具有该id的第一个元素

您的
页面上也有相同id的
sales
。更改id应该可以正常工作。

onclick函数是否触发。另请参阅关于合理使用$.fn名称空间的内容。您能给我们展示一些HTML代码吗？发生这种情况的原因有很多……当你发出
警报（“foo”）时会发生什么在单击函数中？此页面的URL是什么？onclick函数是否触发。另请参阅关于合理使用$.fn名称空间的内容。您能给我们展示一些HTML代码吗？发生这种情况的原因有很多……当你发出
警报（“foo”）时会发生什么在点击功能中？此页面的URL是什么？不幸的是，这并没有解决问题。不过我非常感谢你的帮助。你看到页面加载有任何错误吗？事件是否已附加？我没有看到页面加载时出现任何错误，您可以在查看页面，但遗憾的是，这并没有解决问题。不过我非常感谢你的帮助。你看到页面加载有任何错误吗？事件是否已附加？我没有看到页面加载时出现任何错误，您可以在以下位置查看页面：