當我生成動態Jquery UI滑塊無法獲得值

Question

我有一些JQuery UI滑塊具有不同的數據ID。怎樣才能檢測出誰被選中，並在其旁邊的下一個div中返回滑塊值？ 我產生了滑塊和其他元素dynamicaly：

檢查我的jsfiddle：http://jsfiddle.net/Yg85V/5/

$(document).ready(function() { 
$("#adding").click(function() { 

var intId = $("#buildyourform div").length + 1; 
var fieldWrapper = $("<div class=\"fieldwrapper\" id=\"field" + intId + "\"/>"); 
var fName = $("<input type=\"text\" class=\"fieldname\" value=\"Enter your Facebook fan page url\" />"); 
var fType = $("<div id=\"slider\" data-id=\"slider" + intId + "\" style='width:250px; float:left; margin-left:10px;'></div>").slider(); 
var fLikes= $("<span class=\"slider" + intId + "\" style=\"width: 60px; height: 24px; float: left; margin-left: 13px; margin-top: 7px; border: 1px solid #999; color: rgb(243, 20, 145); text-align: center; font-family: serif;\" />"); 
var fCost = $("<div class=\"fieldname\" id=\"fcost" + intId + "\" style=\"width: 60px; height: 24px; float: left; margin-left: 6px; margin-top: 7px; border: 1px solid #999; color: rgb(243, 20, 145); text-align: center; font-family: serif;\" />"); 
var removeButton = $("<input type=\"button\" class=\"remove\" value=\"-\" />"); 
removeButton.click(function() { 
$(this).parent().remove(); 
}); 
fieldWrapper.append(fName); 
fieldWrapper.append(fType); 
fieldWrapper.append(removeButton); 
fieldWrapper.append(fLikes); 
fieldWrapper.append(fCost); 
$("#buildyourform").append(fieldWrapper); 
}); 
}); 

而且體內：

<fieldset id="buildyourform"> 
<legend>Welcome! <span style="color:#F00; margin-left:13px;">My products</span></legend> 
</fieldset> 

Answer 1

您可以使用jQuery UI的滑塊change事件得到滑塊的值如下：

$("someSelector").slider({ 
     change:function(event, ui) { 

      } 

，並使用ui.value來獲取當前滑塊值

然後使用文件遊歷到值設置爲下一span和div提到：

var fType = $("<div id=\"slider\" data-id=\"slider" + intId + "\" style='width:250px; float:left; margin-left:10px;'></div>").slider({ 
     change:function(event, ui) { 
      //Find next span and div to the current selected slider div 
      $(this).nextAll("span:first").html(ui.value); 
      $(this).parent().find("div.fieldname").html(ui.value); 
      } 
    }); 

希望這有助於。

這裏是更新的JSFIDDLE