<html>
<head>
<title>jQuery 6</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style>
#a1{
background: aqua;
width:80vw;
height:80vh;
}
#a2{
background: maroon;
width:60vw;
height:60vh;
}
#a3{
background: magenta;
width:40vw;
height:40vh;
}
#a4{
background: green;
width:20vw;
height:20vh;
}
#a5{
background: purple;
width:10vw;
height:10vh;
}
#i11{
position:fixed;
}
img{
width:3vw;
position:fixed;
right:5px;
bottom:5px;
}
</style>
</head>
<body>
<a id="a1">
<script>
$(document).ready(function(){
$("tr:odd").css("background-color", "yellow")
$("tr:even").css("background-color", "silver")
/*$("input").blur(function(){
alert('hello')
})
$("input").change(function(){
$("table").hide(1000)
})
$("td").dblclick(function(){
$(this).hide(2000)
})*/
//$("a").click(function(event){
//event.preventDefault();
//})
// $("#a5").css("border", "4px dotted yellow")
//$("#a5").parent().css("border", "4px dotted blue")
//$("#a5").parents().css("border", "4px dotted red")
//$("#a5").parentsUntil("aside").css("border", "4px dotted red")
/*$("#b1").click(function(){
if($("#t1").prop("checked")==true){
$("#t1").prop("checked", false)
}
//else{
$("#t1").prop("checked", true)
}
})*/
$("img").hide();
$(window).scroll(function(){
if ($(this).scrollTop()>120){
$("i11").val($(this).scrollTop())
$("img").fadeIn("slow")
}
else{
$("img").fadeOut("slow")
}
})
})
</script>
<input type="checkbox" id="t1" />
<button id="b1">check/uncheck</button>
<input id="i11">
<table border="1">
<tr>
<th>Company</th>
<th>Country</th>
</tr>
<tr>
<td><a href="http://google.com">Google</a></td>
<td>USA</td>
</tr>
<tr>
<td><a href="http://smentertainment.com">SM entertainment</td>
<td>South Korea</td>
</tr>
<tr>
<td>BitCoin</td>
<td>Japan</td>
</tr>
<tr>
<td>Marvel</td>
<td>USA</td>
</tr>
<tr>
<td>Vans</td>
<td>USA</td>
</tr>
</table>
<div id="a1">
<div id="a2">
<aside id="a3">
<div id="a4">
<div id="a5"></div>
</div>
</aside>
</div>
</div><a href="jquery6.html#a1"><img src="up.jpg">
<br><br><br><br><br><br><br>text<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>text
</body>
</html>
&#13;
所以这是我的完整代码,我试图做的是在滚动时获取输入值,这里出了什么问题?
我一直在反复检查代码,但价值只是赢了。然后通过图像我试图到达页面的顶部,这是有效的,淡入淡出方法也是如此。函数中的问题是什么?
答案 0 :(得分:1)
您错过了#
内的$("i11").val($(this).scrollTop())
所以这将是$("#i11").val($(this).scrollTop())
,请看下面的代码段:
<html>
<head>
<title>jQuery 6</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<style>
#a1{
background: aqua;
width:80vw;
height:80vh;
}
#a2{
background: maroon;
width:60vw;
height:60vh;
}
#a3{
background: magenta;
width:40vw;
height:40vh;
}
#a4{
background: green;
width:20vw;
height:20vh;
}
#a5{
background: purple;
width:10vw;
height:10vh;
}
#i11{
position:fixed;
}
img{
width:3vw;
position:fixed;
right:5px;
bottom:5px;
}
</style>
</head>
<body>
<a id="a1">
<script>
$(document).ready(function(){
$("tr:odd").css("background-color", "yellow")
$("tr:even").css("background-color", "silver")
/*$("input").blur(function(){
alert('hello')
})
$("input").change(function(){
$("table").hide(1000)
})
$("td").dblclick(function(){
$(this).hide(2000)
})*/
//$("a").click(function(event){
//event.preventDefault();
//})
// $("#a5").css("border", "4px dotted yellow")
//$("#a5").parent().css("border", "4px dotted blue")
//$("#a5").parents().css("border", "4px dotted red")
//$("#a5").parentsUntil("aside").css("border", "4px dotted red")
/*$("#b1").click(function(){
if($("#t1").prop("checked")==true){
$("#t1").prop("checked", false)
}
//else{
$("#t1").prop("checked", true)
}
})*/
$("img").hide();
$(window).scroll(function(){
if ($(this).scrollTop()>120){
$("#i11").val($(this).scrollTop())
$("img").fadeIn("slow")
}
else{
$("img").fadeOut("slow")
}
})
})
</script>
<input type="checkbox" id="t1" />
<button id="b1">check/uncheck</button>
<input id="i11">
<table border="1">
<tr>
<th>Company</th>
<th>Country</th>
</tr>
<tr>
<td><a href="http://google.com">Google</a></td>
<td>USA</td>
</tr>
<tr>
<td><a href="http://smentertainment.com">SM entertainment</td>
<td>South Korea</td>
</tr>
<tr>
<td>BitCoin</td>
<td>Japan</td>
</tr>
<tr>
<td>Marvel</td>
<td>USA</td>
</tr>
<tr>
<td>Vans</td>
<td>USA</td>
</tr>
</table>
<div id="a1">
<div id="a2">
<aside id="a3">
<div id="a4">
<div id="a5"></div>
</div>
</aside>
</div>
</div><a href="jquery6.html#a1"><img src="up.jpg">
<br><br><br><br><br><br><br>text<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>text
</body>
</html>
&#13;