連接滑塊標籤

從數據庫中的數據可滑動的即時閱讀了很多，每個都帶有獨特的ID，例如18056.連接滑塊標籤

所以使用jQuery我表現的圖形用戶接口，顯示每個可滑動值滑塊和標籤我輸出到頁面的，典型：

<html> 

    <head> 
     <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.9.custom.css" rel="stylesheet" />  
     <script type="text/javascript" src="js/jquery-1.4.4.min.js"></script> 
     <script type="text/javascript" src="js/jquery-ui-1.8.9.custom.min.js"></script> 
     <script type="text/javascript"> 
      $(function(){ 

       $(".slider").slider({ 

        range: true, 
        min: 0, 
        max: 100, 
        values: [parseInt($("#from"+(this.id).split("slider")[1]).text()), parseInt($("#to"+(this.id).split("slider")[1]).text())], 

        slide: function(event, ui) { 

         $("#from"+this.id.split("slider")[1]).text(ui.values[0]); 
         $("#to"+this.id.split("slider")[1]).text(ui.values[1]); 
        } 

        });    
      }); 
     </script> 
    </head> 

    <body> 
     <label id="from0">10</label>-<label id="to0">90</label> 
     <div id="slider0" class="slider"></div> 
    </body> 

</html>

它說我可以打電話給分割線15上的值：...行:(任何人都有一個線索

來源

2011-02-02 Jason94

您應該使用.html()？而不是.val()

$(".slider").slider(
{ 
range: true, 
values: [ $("#label_"+this.id.split("slider_")[1]).html(), $("#label_"+this.id.split("slider_")[1]).html() ], 
...

但它可能是最好只添加標籤值到<div>這樣的：

<div id="slider_18056" class="slider" data-value="10"></div>

然後你就可以用$(this).attr('data-value')

我不知道訪問你正在使用什麼滑塊插件，但它似乎無法確定你想要的選項中的this。你可以試試這個方法，而不是：

$(document).ready(function(){ 
    $(".slider").each(function(){ 
    $(this).slider({ 
     range: true, 
     min: 0, 
     max: 100, 
     values: [parseInt($("#from"+(this.id).split("slider")[1]).text()), parseInt($("#to"+(this.id).split("slider")[1]).text())], 
     slide: function(event, ui) { 
     $("#from"+this.id.split("slider")[1]).text(ui.values[0]); 
     $("#to"+this.id.split("slider")[1]).text(ui.values[1]); 
     } 
    }); 
    }); 
});

來源

2011-02-02 14:52:10 Mottie

但我想表明的價值，我想，因爲他們都是你用 – Jason94 2011-02-02 15:02:42

連接滑塊標籤

回答

相關問題