Foro de elhacker.net

$("#slider").slider({
	min: 1,
	max: 100,
	value: 1,
	slide: function( event, ui ) {
		$( "#result" ).html( ui.value );
	}
});
 

<div id="slider" class="slider"></div><br>
Cantidad: <span id="result">1</span>

	<div data-role="fieldcontain" style="display:none;">
		<fieldset data-role="controlgroup" data-type="horizontal">
		   <input type="checkbox" name="checkbox-1" id="checkbox-1" class="custom" />
		   <label for="checkbox-1">1</label>
		</fieldset>
	</div>

$("#slider").slider({
  min: 1,
  max: 30,
  value: 1,
  slide: function( event, ui ) {
    // Numero minimo
    var start = 1;
 
    $( "#result" ).html( ui.value );
    // Limpiamos los anteriores Checkboxes
    $('#showChck').html('');
 
    // Segun el numero, segun la cantidad de Checkboxes
    $(new Array(ui.value)).each(function(){
 
      // Agreamos el nuevo checkbox
      $('#showChck').prepend(
        $('<input/>', {type:"checkbox", name:"checkbox-" + start, id:"checkbox-" + start, class:"custom"}),
        $('<label/>', {for: 'checkbox-' + start }).text(start),
        $('<br>')
      );
 
      // Incrementamos
      start++;
    });
  }
});

...
<!-- Solo agrege un id -->
<fieldset data-role="controlgroup" data-type="horizontal" id="showChck">
  <!-- CheckBoxes -->
</fieldset>
...

$("#checkbox-" + start).click(function(){
    $("#showSldr").prepend(
        $('<div></div>', {id: "slider-" + start, class: "slider", }),
        $('Lineas: <span>1</span>', {id: 'result-' + start}).text(start)
    );
});

// Nota que ahora utilizamos body para que busque en todo el 
//contenido DOM segun el selector, en este caso #showChck input.
$('body').on('click', '#showChck input', function() {
  console.log('presionado');
  // Hacer algo
});

var $start = $("#slider").slider('value');
$(new Array($start)).each(function () {
    $('body').on('click', '#showChck input', function() {
        console.log('presionado');
        $("#showSldr").append(
            $('<div></div>', {id: $start, class: "slider", }),
            $('Lineas: <span>1</span>', {id: 'result-' + $start}).text($start)
         );
    });
    $start++;
});
 

$('body').on('click', '#showChck input', function() {
    var $id = event.target.id;  // ID DEL CHECKBOX
        $( "#test" ).val($id);
        if ($("#slider-" + $id).length) { // COMPROBAR SI EXISTE
            $("#slider-" + $id).fadeToggle();
    }
        else { // SI NO EXISTE SE CREA
            $("#showSldr").append(
                  $('<div></div>', {id: "slider-" + $id, class: "slider", }),
                  $('Lineas: <span>1</span>', {id: 'result-' + $id}).text($id)
             );
    }
});
 

$('body').on('click', '#showChck input', function() {
    var x = this.id;
    var $id = x.replace(/\D/g, '');
 
    if ($("#slider-" + $id).length) {
        $("#slider-" + $id).fadeToggle();
        $("#result-" + $id).fadeToggle();
    }
    else {
        $("#showSldr").append(
            $('<div/>', {id: "slider-" + $id, class: "slider"}),
            $('<span/>', {id: 'result-' + $id}).text('4')
        );
        $("#slider-" + $id).slider({
            min: 4,
            max: 100,
            value: 4,
            step: 2,
            slide: function( event, ui ) {
                $( "#result-" + $id ).html( ui.value );
            }
        });
    }
});

$("body").on("click", "#showChck input", function() {
  var x = this.id;
  var $id = x.replace(/\D/g, "");
 
  // Obtenemos el slider nuevo
  var slider = $("#slider-" + $id);
 
  // El slider no existe?
  if (!slider.length) {
 
    // Nota que <span> ira dentro del div, sino 
    // se complica
    var nuevoSlider = $("<div/>", {
      id: "slider-" + $id,
      "class": "slider"
    }).append($("<span/>", {
      id: "result-" + $id
    }).text("4"));
 
    // Si no existe creamos uno nuevo, nota que
    // estamos en la posision sobre el checkbox
    // asi que al slider nuevo lo ponemos despues
    // de <label>
    $(this).next("label").after(nuevoSlider);
    nuevoSlider.slider({
      min: 4,
      max: 100,
      value: 4,
      step: 2,
      slide: function(event, ui) {
        $("#result-" + $id).html(ui.value);
      }
    });
  }
 
  // Si el checkbox esta seleccionado, mostramos
  // el slider, sino lo ocultamos
  if ($(this).is(":checked")) {
    slider.show();
  } else {
    slider.hide();
  }
});