jQuery appendTo（來回切換）

所以我試圖完成的是一個簡單的附加到某個元素。我在被執行後，此問題在運行，其追加到位置，但然後繼續回到它駐留在UL。jQuery appendTo（來回切換）

<script type="text/javascript"> 
    function execute() { 
     $('#desCopy').appendTo('#description') 
     $('#imgPlace').appendTo('#IMGbox') 
    } 
</script> 

<div id="content" style="background:#000; width:989px;"> 
    <div style="float:left; left:18px; margin:0; width:337px; position:relative; padding:15px 0 0 0; color:#FFF;"> 
     <div id="description"> 
     </div> 
    </div> 

    <div 
     id="IMGbox" 
     style="float:left; position:relative; display:block; background:#F00; width:652px; height:258px; background:#0FF; overflow:hidden;"> 
    </div> 

    <div style="float:right; background:#CCC; height:25px; width:652px;"> 
     <ul> 
      <li><a href="" onclick="execute()">Slide 1</a> 
       <ul style=""> 
        <li><span id="desCopy">Test description, Test description</span></li> 
        <li><img src="images/test.jpg" id="imgPlace"></li> 
       </ul> 
      </li> 
     </ul> 
    </div> 
</div>

來源

2010-03-02 Starboy

更改事件處理程序設置是這樣的：

<a href="" onclick="execute(); return false">

更重要的是，用jQuery設置它，使處理程序返回false：

// somewhere in your initialization code: 
$(function() { 
    $('#theAnchorTag').click(function() { 
    $('#desCopy').appendTo('#description'); 
    $('#imgPlace').appendTo('#IMGbox'); 
    return false; 
    }); 
});

你必須給你的<a>的「id」值（在我的例子中是「theAnchorTag」），或者你可以在設置「click」處理程序的選擇器中以其他方式識別它。你最好使用jQuery綁定事件處理程序;那些「onfoo」屬性非常噁心。

來源

2010-03-02 16:08:33 Pointy

+1刪除了我的答案。感謝您指出錯誤。給Starboy一個完整的jQuery解決方案可能不是一個壞主意。 – user113716 2010-03-02 16:11:16

感謝兄弟 - 我真的很難輸入速度足以擊敗你的答案:-) – Pointy 2010-03-02 16:12:29

感謝您的響應波蒂！ – Starboy 2010-03-02 16:12:52

你不得不返回從執行假以防止事件冒泡。

來源

2010-03-02 16:06:28

在這種情況下，問題不在於冒泡，而在於單擊「a」元素的默認行爲。 – user113716 2010-03-02 16:08:35

的問題是，一個空的HREF（如與您聯繫的情況下），點擊時會重新加載頁面..

所以你重新安排你的li元素，然後在頁面重新加載得到恢復一切回到他們如何最初..

正如你需要通過返回從您的處理程序錯誤的取消默認點擊動作其他的答案中提到..

你也應該看看與jQuery的分配處理程序，而不是內聯屬性..

來源

2010-03-02 16:13:17

謝謝你在這裏的解釋加比，真的幫助我。 – Starboy 2010-03-02 16:15:51

jQuery appendTo（來回切換）

回答

相關問題