2
我試圖導航到一個div標籤，由id，在沒有頁面自動滾動到div的網頁。以下是我有：如何使用jQuery「onClick」鉤子和event.preventDefault（）;
<a id="submission" href='#Home' class="bannerLink">Home</a>
我有一個jQuery腳本：behaviour.js在HTML文件的進口機頭，警告框出現，所以我知道它進入的功能。
在這個腳本我有：
$(function(){
$("#submission").on("click", function(event){
alert('HI');
event.preventDefault();
submitComment();
});
});
我增加了一個onclick事件的HTML源代碼，命名一個特定的函數來執行它的作品，因爲我已經在那裏放警報，但event.preventDefault();沒有按不開火。
這裏的HTML：
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" media="screen, projection" href="text.css"/>
<link rel="stylesheet" type="text/css" media="screen, projection" href="page.css"/>
<link rel="stylesheet" type="text/css" media="screen, projection" href="refineslide/refineslide.css"/>
<link rel="stylesheet" href="refineslide/refineslide-theme-dark.css" />
<link rel="stylesheet" href="reveal/reveal.css">
<script src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="behaviour.js"></script>
<!--
*
* ANIMTED BUTTNONS SRC HERE
* NOT BY ME
*
-->
<link rel="stylesheet" href="animatedbuttons/buttons.css">
<!--
*
* KWICKS SRC HERE
* NOT BY ME
*
-->
<link rel='stylesheet' type='text/css' href="kwicks/jquery.kwicks.css" />
<style type='text/css'>
.kwicks {
width: 515px;
height: 100px;
}
.kwicks > li {
width: 125px;
height: 100px;
/* overridden by kwicks but good for when JavaScript is disabled */
margin-left: 5px;
float: left;
}
</style>
<!-- Including the Lobster, Arvo, Allan & PT Sans fonts from Google's Font Directory -->
<link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Lobster" />
<link rel="stylesheet" href='http://fonts.googleapis.com/css?family=Arvo' />
<link rel="stylesheet" href='http://fonts.googleapis.com/css?family=PT+Sans' />
<link rel="stylesheet" href='http://fonts.googleapis.com/css?family=Allan:bold' />
</head>
<body>
<!-- START BANNER DIV -->
<div class="divBanner">
<a href="updatelog/index.php" class="bannerLink">Update Log!</a>
<a id="submission" href='#Home' onClick="test();" class="bannerLink">Home</a>
</div>
<!-- END BANNER DIV -->
<!-- START Center page container -->
<div class="divCenter">
<!-- KWICKS SET -->
<div class="kwicksOutsideContainer">
<div class="kwicksInsideContainer nudge">
<ul class='kwicks kwicks-horizontal'>
<li id='panel-1'>
<div class="outerPanelDiv">
<div class="innerPanelDiv">
<a href='#Events' class="menuLink">Events</a>
</div>
</div>
</li>
<li id='panel-2'>
<div class="outerPanelDiv">
<div class="innerPanelDiv">
<a href='#Committee' class="menuLink">Committee</a>
</div>
</div>
</li>
<li id='panel-3'>
<div class="outerPanelDiv">
<div class="innerPanelDiv">
<a href='#Sponsors' class="menuLink">Sponsors</a>
</div>
</div>
</li>
<li id='panel-4'>
<div class="outerPanelDiv">
<div class="innerPanelDiv">
<a href='#About' class="menuLink">About</a>
</div>
</div>
</li>
</ul>
</div>
</div>
<!-- END KWICKS SET -->
<!-- SLIDER SET -->
<div class="sliderContainer">
<br /><br />
<ul class="rs-slider">
<li><img src="slide_img/img1.jpg" alt="" /></li>
<li><img src="slide_img/img2.jpg" alt="" /></li>
<li><img src="slide_img/img3.jpg" alt="" /></li>
</ul>
</div>
<!-- END SLIDER SET -->
<div class="divHead">
<div class="welcomeMessage"></div>
<div class="bookmarkRibbon"></div>
<div class="welcomeBox nudge">
<a href="#" data-animationspeed="650" data-reveal-id="myModal" class="welcomeW">W</a>
</div>
<div class="kccLogo"></div>
</div>
<!-- START DIV BODY -->
<div class="divBody">
<!-- START DIV HOME -->
<div id='Home'>
<!-- START LEFT SIDE -->
<div class="rightContainer">
<div class="rightContainerHead">
<ul class="webHeading">
<li>KCC Events!</li>
</ul>
</div>
<div class="rightSliderContainer">
<ul class="rs-slider2">
<li><img src="slide_img_event/img1.jpg" alt="" /></li>
<li><img src="slide_img_event/img2.jpg" alt="" /></li>
</ul>
</div>
</div>
<!-- END LEFT SIDE -->
<!-- START RIGHT SIDE -->
<div class="leftContainer">
<!-- START TOP -->
<div class="topLeft">
<ul class="webHeadingQuestion">
<li>What Is KCC?</li>
</ul>
<div class="tucked-corners">
<div class="top-corners"></div>
<p class="webText">
KCC, or Korean Cultural Club, is a club formed during 2011 at UWA. With a passionate interest in Korean culture you can expect a full Korean experience with us. Our aim is to spread Korean culture and immerse other students in it. We do this through our events, chill sessions and activities.
<br><br>
KCC is rapidly growing, so jump right in and join!
</p>
<div class="bottom-corners"></div>
</div>
<!--
<div class="topLeftTextContainer">
<p class="webText">
KCC, or Korean Cultural Club, is a club formed during 2011 at UWA. With a passionate interest in Korean culture you can expect a full Korean experience with us. Our aim is to spread Korean culture and immerse other students in it. We do this through our events, chill sessions and activities.
<br><br>
KCC is rapidly growing, so jump right in and join!
</p>
</div>
-->
</div>
<!-- END TOP -->
<!-- START MIDDLE -->
<div class="middleLeft">
<a href="#" class="button kcc medium">Find Out More</a>
</div>
<!-- END MIDDLE -->
<div class="bottomLeft"></div>
</div>
<!-- END RIGHT SIDE -->
</div>
<!-- END DIV HOME -->
<!-- START DIV EVENTS -->
<div id='Events'>
</div>
<!-- END DIV EVENTS -->
</div>
<!-- END DIV BODY -->
</div>
<!-- END Center page container -->
<!-- MODAL HERE -->
<div id="myModal" class="reveal-modal">
<!-- START NOTEPAD HERE -->
<div class="notepadTop">
<p class="notepadTitle">Hey There!</p>
</div>
<div class="notepadMiddle">
<div class="notepadMargin"></div>
<p class="notepadText">
We need to sort some things out before we start.
<br><br>
This site uses the Webkit layout engine and will <span class="notepadHighlight">only work with the following browsers:</span>
</p>
<ul class="notepadList">
<li>Google Chrome</li>
<li>Safari</li>
</ul>
<p class="notepadTextTwo">
No, Firefox is not 100% supported because it doesn't use Webkit. Internet Explorer doesn't work at all.
<br><br>
<span class="notepadHighlight">The menu is above the image slider</span> and you can show this item again by clicking the blue "W", next to the red ribbon.
</p>
</div>
<div class="notepadBottom">
<p class="notepadTextFooter">Enjoy!</p>
</div>
<!-- END NOTEPAD HERE -->
<a class="close-reveal-modal">×</a>
</div>
<!-- END MODAL -->
<!--
*
* SLIDER CALLS
*
-->
<script src="refineslide/jquery.refineslide.min.js"></script>
<script>
$(document).ready(function() {
$('.rs-slider').refineSlide({
transition : 'random',
transitionDuration : 1000,
autoPlay : true,
keyNav : false,
delay : 3000,
controls : null
});
});
</script>
<script>
$(document).ready(function() {
$('.rs-slider2').refineSlide({
transition : 'cubeV',
transitionDuration : 1000,
autoPlay : false,
keyNav : false,
delay : 4000,
controls : 'arrows'
});
});
</script>
<!--
*
* KWICKS CALLS
*
-->
<script src='kwicks/jquery.kwicks.js' type='text/javascript'></script>
<script type='text/javascript'>
$(function() {
$('.kwicks').kwicks({
size: 125,
maxSize : 250,
spacing : 5,
behavior: 'menu'
});
});
</script>
<!--
*
* REVEAL CALLS
*
-->
<script src="reveal/jquery.reveal.js" type="text/javascript"></script>
</body>
</html>
，它正在..see此琴： - http://jsfiddle.net/VKKpD/ – Pranav
爲什麼如果我導入到HTML源文件的
部分，那麼它是不是對我有用？ –您是否查看過任何針對js錯誤的開發人員工具？很難說，爲什麼它特別不適合你。 – movsky