如何重置jquery中的div標記

Question

我在我的html頁面中有一個下拉框，我需要將下拉列表重置爲其原始狀態。我的代碼片段如下：

<div id="countries" > 
<!---------------I select a particular module-----------------> 
    <select id="modules" onchange = "getRole()"> <!--Function getRole() called here--> 
       <option>---Select---</option> 
       <option value="1">Module1</option> 
       <option value="2">Module2</option> 
       <option value="3">Module3</option> 
       <option value="4">Module4</option> 
     </select> 
    <!-Based on the modules some processing is done and countries are displayed-> 
    <select multiple="multiple" id="country" name="country[]"> 

      <option value="1">India</option> 
      <option value="2">USA</option> 
      <option value="3">Russia</option> 

     </select> 
</div> 

我需要重新設置下拉菜單中進行一些處理

在我需要用我的下拉做所有的處理後找回我原來的狀態，換句話說之後。

我使用.clone（），但似乎沒有工作。

function getRole() { 
    //CLone the id 'countries' 
    var cloneobj = $('#countries').clone(); 

    //Some processing here 
    .... 

    //After processing get back the original state 
    $('#countries').replaceWith(cloneObj); 
} 

這裏的問題是克隆是創建重複的ID，因此劑量似乎是正確的解決方案。任何人都可以幫忙請

Answer 1

首先，ID

var cloneobj = $('#countries').clone(); 

提供#，並嘗試

$('#countries').replaceWith(cloneObj); 

JavaScript是案例功能狀態的敏感！

clone()不同於Clone()。

更新2

我發現你：你錯過</select>標籤和註釋的問題

<div id="countries" > 
<!---------------I select a particular module-----------------> 
    <select id="modules" onchange = "getRole()"> <!--Function getRole() called here--> 
       <option>---Select---</option> 
       <option value="1">Module1</option> 
       <option value="2">Module2</option> 
       <option value="3">Module3</option> 
       <option value="4">Module4</option> 

    </select> <!-- Here you forgot --> 

    <!--Based on the modules some processing is done and countries are displayed !. You forgot one `-` --> 
    <select multiple="multiple" id="country" name="country[]"> 

      <option value="1">India</option> 
      <option value="2">USA</option> 
      <option value="3">Russia</option> 

     </select> 
</div> 

更新3

使用jQuery事件見我的例子：http://jsfiddle.net/6WLVC/

不過，我不知道w hy getRole()不能使用onchange事件select標記。

似乎jQuery函數僅在$(function(){ ... });初始化中起作用。

Answer 2

我認爲你應該使用clone()（區分大小寫），使用id哈希#，並使用正確的對象做替換。 （您保存克隆的對象在cloneobj和使用cloneObj這是不確定的（區分大小寫替換）

克隆選項和替換這樣的：

function getRole() { 
    //Clone the id 'countries' 
    var clonedObj = $('#countries').clone(); 

    //Some processing here 
    .... 

    //After processing get back the original state 
    $('countries').replaceWith(clonedObj); 
}