<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>jquery 事件</title>
<script src='jquery-3.3.1.min.js'></script>
<style>
#out{
width:300px;
height:300px;
background: blue;
border-radius: 50%;
position:absolute;
}
#mid{
width:200px;
height:200px;
background: yellow;
border-radius: 50%;
position: absolute;
left:50px;
top:50px;
}
#inr{
width:100px;
height:100px;
background: purple;
border-radius: 50%;
position: absolute;
left:50px;
top:50px;
}
</style>
</head>
<body style='height:2000px;width:2000px'>
<a href="http://www.baidu.com" id='as'>点击百度</a>
<div id='out'>
<div id='mid'>
<div id='inr'></div>
</div>
</div>
</body>
<script type="text/javascript">
$('#as').click(function(){
//jquery中使用location格式
//location.href = ''
location.href = 'http://www,baidu.com';
//replace
//replace() 方法用于在字符串中用一些字符替换另一些字符,或替换一个与正则表达式匹配的子串。
//此处用于替换掉replace
location.replace('http://www.sina.com.cn');
//return false用于阻止默认行为
//如果会产生事件蔓延或事件冒泡,使用return可以组织该事件冒泡或事件蔓延
return false;
//事件冒泡/蔓延,是指设置了一个总体集合给定了某些样式,而子元素的样式也被影响
//使用return false 的方式,可以有效的阻止时间冒泡;
$('div').click(function(){
$(this).css('background','pink');
return false;
})
})
</script>
</html>点击 "运行实例" 按钮查看在线实例
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号