2010-09-14 69 views
1

我有一個簡單的形式與2個下拉菜單。我無法弄清楚如何做的是有一個簡單的HTML鏈接,將選擇從第一個選擇菜單複製到第二個。有一點需要注意的是,我們不在表單輸入字段中設置'id',所以我需要使用'name'字段來完成JQuery對象選擇。下面是窗體的HTML:JQuery重複表單選擇菜單選擇

<form action="/form/update" name="update-form" method="POST"> 

<select name="menu1_selection"> 
<option value="">-</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
<option value="8">8</option> 
<option value="9">9</option> 
<option value="10">10</option> 
<option value="11">11</option> 
<option value="12">12</option> 
</select> 

<select name="menu2_selection"> 
<option value="">-</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
<option value="4">4</option> 
<option value="5">5</option> 
<option value="6">6</option> 
<option value="7">7</option> 
<option value="8">8</option> 
<option value="9">9</option> 
<option value="10">10</option> 
<option value="11">11</option> 
<option value="12">12</option> 
</select> 

<a href="#" onclick="return false;" class="copyMenu1">copy</a> 

</form> 

這裏是我目前使用不工作,因爲它是不能夠從第一菜單中選擇正確的值的JQuery:

<script type="text/javascript"> 
    $(document).ready(function() { 
    $("a.copyMenu1").click(function(){ 
     $("input[name='menu1_selection']").val($("input[name='hmenu2_selection']").val()); 
    }); 
    }); 
</script> 

我嘗試了大約100種不同的方式,仍然無法找到正確的方法從第一個菜單中選擇值,並使用'name'字段選擇從第二個菜單中進行相同的選擇。在此先感謝您的幫助!

回答

2

你需要一個<select>element selector代替,就像這樣:

$(function() { 
    $("a.copyMenu1").click(function(){ 
    $("select[name='menu1_selection']").val($("select[name='menu2_selection']").val()); 
    }); 
}); 

也有在menu2_selection選擇需要刪除,you can test it here額外h。如果您打算複製任何樣式輸入,您可能已經在the :input selector之後。

一個音符上演示,喜歡你的代碼,此份第二菜單第一,而不是其他方式,所以一定要設置第二個下拉,然後單擊複製。

+0

工作就像一個魅力。感謝您捕捉這些情侶問題。 – 2010-09-14 17:27:20