如何從comboBoxes更新jQuery字段？

Question

我有一個項目合併在一個表單字段中的兩個變量。房間

1. 數
2. 每間客房的人數。

該唯一字段將具有每個房間/每個房間的人的價值，並且每個房間將由「|」分隔。

所以，你有3個房間和2人在每個房間= 2 | 2 | 2個

或者2室，1室2人及2號室3人= 2 | 3

我已經準備好2 jQuery函數：

1. 者＃的克隆和
2. 克隆項目的值的更新。

我遇到的問題是每個函數獨立工作，並且當用戶更新一個單表單字段dos不更新。

如何合併或更新兩個功能作爲一個功能？

我已經發布工作的例子@

http://jsfiddle.net/HxsnJ/

下面是HTML代碼

Number of rooms<br /> 
<select id="itemCount" name="itemCount"> 
<option selected value="1">1 item</option> 
<option value="2">2 items</option> 
<option value="3">3 items</option> 
<option value="4">4 items</option> 
</select><br /><br /> 
Number of persons<br /> 
<select name="cloneElement1" id="item_dup_1" class="room"> 
    <option value="">Select One</option> 
    <option value="1">1</option> 
    <option selected value="2">2</option> 
    <option value="3">3</option> 
</select><br /><br /> 

<input type="text" name="myNumbers" value="2"> 

這裏jQuery的

// fn Clone Boxes 
jQuery.fn.fieldsManage = function (number) { 
    var ele = $(this); 
    var clones = ele.data("clones"); 
    clones = clones ? clones : new Array(ele.attr("id")); 
    if (clones.length < number) { 
     var clone; 
     while(clones.length < number) { 
      clone = ele.clone(true); 
      var id = clones[0]+clones.length; 
      clone.attr("id", id); 
      $("#"+clones[clones.length-1]).after(clone); 
      clones.push(id); 
     } 
    } else { 
     while(clones.length > number) { 
      $("#"+clones.pop()).remove(); 
      $(function(){ 
       $("[name='myNumbers']").val(myNumbers.join('|')); 
      }); 
     } 
    } 
    ele.data("clones", clones); 
} 
// Create Clone Boxes 
$(document).ready(function() { 
    $("#itemCount").change(function() { 
     $("#item_dup_1").fieldsManage(this.value); 
    }); 
}); 

// Values from Cloned Boxes 
$(function(){ 
    $('.room').change(function(e){ 
     var myNumbers = []; 
     $('.room').each(function(){ 
      myNumbers.push($(this).val()); 
     }) 
     $("[name='myNumbers']").val(myNumbers.join('|')); 
    }); 
}); 

Answer 1

是你的問題，該值是當您選擇不同數量的房間時不會令人耳目一新？如果是的話就來看看這個http://jsfiddle.net/gSkpq/

注意您可以使用jQuery's live一個事件綁定到可能被動態地添加和刪除