Jquery ui 交换？_Jquery Ui - Fatal编程技术网

Jquery ui 交换？

jquery-ui

Jquery ui 交换？,jquery-ui,Jquery Ui,这是我的示例代码 <div id="id-1"><div>sampledata</div><span>sampledata</span></div> <div id"id-2"><div>sampledata</div><div> smpledata</div></div> <div id"id-3"><div>sampleda

这是我的示例代码

<div id="id-1"><div>sampledata</div><span>sampledata</span></div> 
<div id"id-2"><div>sampledata</div><div> smpledata</div></div>
<div id"id-3"><div>sampledata</div><div> smpledata</div></div>
<div id"id-3"><div>sampledata</div><div> smpledata</div></div>

我只有一个div的id，例如id-3。我想用next来交换，因为a里面有多个，我不能用next

提前感谢

好吧，选择div，然后查找next并在next之后插入

.下一步；选择下一个同级元素，而不是子div元素。但是，要确保选择下一个实际为div的同级，应使用.nextdiv

只要将上一个div的id更改为id-4，上面的代码就可以与您给出的示例一起工作

或者，您可以复制并粘贴此代码以用于工作示例：

<html>
    <head>
        <title>Div Swap Test Page</title>
        <style type="text/css">
            #id-1,#id-2,#id-3,#id-4 {height: 50px; margin:10px 0; border:solid 1px #000}
            #id-3 {border:solid 1px #D00}
            #id-4 {border:solid 1px #0D0}
        </style>
    </head>

    <body>
        <div id="id-1"><div>This is div #1</div><span>I am first.</span></div>
        <div id="id-2"><div>This is div #2</div><span>I am second.</span></div>
        <div id="id-3"><div>This is div #3</div><span>I am third.</span></div>
        <div id="id-4"><div>This is div #4</div><span>I am last.</span></div>
        <p><button id="btn"><span>Swap</span></button></p>
    </body>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(function() {
        $("#btn").click(function() {
            $("#id-3").before($("#id-3").next("div"));
        });
    });
    </script>
</html>

你能解释一下你想要的结果是什么样的吗？很难跟踪所有的div，你想用哪个div交换哪个div？你能澄清你的问题吗？你想完成什么？id-2和id-3中的每一个都有不止一个div，您重复id-3两次，所以我假设最后一个应该是id-4，我有一组div，我想用另一个div交换这个div。我只有一个div id。我想用下一个div交换这个div。他似乎想用下一个div交换订单。现在搬家似乎很流行。。。在我的例子中，下一步会起作用吗？我用$'id-3'尝试过的main中有标记。在'id3'之后插入。下一步。。在我的主楼里，这不是working@kiran只要复制我的代码试试，你可以很容易地修改它，如果它不工作，然后让我know@kiran这是工作代码$'id-3'。在$'id-3'之后插入。下一个代码是您在那里得到的错误代码，此外，您的html@experimentX ; 如果没有其他方法，它就不起作用了

$("#id-3").before($("#id-3").next("div"));

<html>
    <head>
        <title>Div Swap Test Page</title>
        <style type="text/css">
            #id-1,#id-2,#id-3,#id-4 {height: 50px; margin:10px 0; border:solid 1px #000}
            #id-3 {border:solid 1px #D00}
            #id-4 {border:solid 1px #0D0}
        </style>
    </head>

    <body>
        <div id="id-1"><div>This is div #1</div><span>I am first.</span></div>
        <div id="id-2"><div>This is div #2</div><span>I am second.</span></div>
        <div id="id-3"><div>This is div #3</div><span>I am third.</span></div>
        <div id="id-4"><div>This is div #4</div><span>I am last.</span></div>
        <p><button id="btn"><span>Swap</span></button></p>
    </body>

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(function() {
        $("#btn").click(function() {
            $("#id-3").before($("#id-3").next("div"));
        });
    });
    </script>
</html>