So i'm trying to make a section fade out before following a link like so
<a class="fadelink" href="path/to/file">Hello</a>
<script type="text/javascript">
$("a.fadelink").click(function(e){
e.preventDefault();
$("#content").fadeTo(400,0,function(){
window.location.href = $(this).attr("href");
});
});
</script>
Problem is, jQuery keeps returning me with "undefined" and 404's the redirect.
Your $(this)
in $(this).attr("href")
is pointing to $("#content")
which is wrong . Move it into the right scope:
$("a.fadelink").on("click", function( evt ) {
evt.preventDefault();
var goTo = $(this).attr("href"); // get href value of `this` anchor
$("#content").fadeTo(400, 0, function() {
window.location = goTo; // Now you can use it
});
});
You're referring to the wrong this
. The href
attribute is present on the anchor, not the #content
element.
$("a.fadelink").click(function(e){
e.preventDefault();
var that = this;
$("#content").fadeTo(400,0,function(){
window.location.href = $(that).attr("href");
});
});
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.