Question

我是初学者，我的英语很糟糕，所以我在前面道歉。我有以下CSS：

#wrapper{
    width: 200px;
    height: 300px;
    border: solid 1px #000; 
    overflow: visible;
    white-space: nowrap;
}
.page{
    display: inline-block;
    margin-right: -4px;
    width: 200px;
    height: 300px;
}
#page1{
    background-color: #CF9; 
}
#page2{
    background-color: #FC9;
}
#page3{
    background-color: #99F;
}
h1{
    color: white;   
}

HTML：

<div id="wrapper">
<div class="page" id="page1"><h1>page1</h1>
<ul>
<li><a href="#page1">page 1</a></li>
<li><a href="#page2">page 2</a></li>
<li><a href="#page3">page 3</a></li>
</ul>
</div>
<div class="page" id="page2"><h1>page1</h1>
<ul>
<li><a href="#page1">page 1</a></li>
<li><a href="#page2">page 2</a></li>
<li><a href="#page3">page 3</a></li>
</ul>
</div>
<div class="page" id="page3"><h1>page1</h1>
<ul>
<li><a href="#page1">page 1</a></li>
<li><a href="#page2">page 2</a></li>
<li><a href="#page3">page 3</a></li>
</ul>
</div>
</div>

和Jquery：

$( document ).ready(function() {
    $(".page a").click(function(){
        fromURL=$(this).closest(".page").attr("id");
        toURL = $(this).attr("href");
        $(toURL).insertAfter(fromURL);
        //$("#page3").insertAfter("#page1"); //this works
        })


    });

似乎.insertAfter不适用于vars。我怎样才能实现这一目标？

Answer 1

fromURL是一个没有哈希符号的ID，因此它看起来像是jQuery的元素名称，因此它不会选择任何内容。你可以把它变成一个ID选择器：

$(toURL).insertAfter("#" + fromURL);

但你仍然有元素。谁需要身份证？

var page = $(this).closest(".page");
var toURL = $(this).attr("href");
$(toURL).insertAfter(page);

顺便声明你的变量。隐含的全局变量很糟糕。严格模式和JSHint可以帮助解决这个问题。

使用带有.insertAfter的变量不起作用

1 个答案: