Проблемы с JQuery Slider + Event

0

У вас немного проблемы с работой JQuery. Когда ползунок перемещается, он должен обновить указанное поле со значением ползунка. В настоящее время это не работает

Код можно найти ниже, и пока он работает на ссылке jsfiddle, он не работает во второй ссылке, вы можете перемещать слайдер, но его значение не отображается.

http://jsfiddle.net/j08691/2N4Y8/

Пожалуйста, проигнорируйте двойное начало #slider.

Я попытался воспроизвести код в jsfiddle как таковой:

<html>
<head>

<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<link href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css' rel='stylesheet' type='text/css'>


<script>
 $(function () {
  $('#slider').slider({

      value: 50,
      min: 10,
      max: 100,
      step: 10
  });

  $(document).on("click", "#show-slider", function () {
      $('#slide').toggle("slow");
  });
  });
  $("#slider").slider({
  slide: function (event, ui) {
      $("#slider-value").html(ui.value);
  },
  change: function (event, data) {
      alert(data.value)
  }
  });

  $("#slider-value").html($('#slider').slider('value'));</script>


<body>
<h5>You can alter the reading ease of the page using the slider below.<span id="show-    slider"> To toggle it click here.</span></h5>


<h5>The current Flesch reading ease score is at : <span id="slider-value"></span> </h5>

</div>
<div id="slide">
<br />
<div id="slider"></div>
<br />
<br />
</div>

</body>
</html>

Результаты которого можно найти по адресу:

http://shavid.webfactional.com/

Как вы можете видеть, как размещено здесь, оно, похоже, не работает, какие-либо предложения?

  • 0
    Я не понимаю Это работает на скрипке. Какой вопрос?
  • 0
    Проверьте нижнюю ссылку, она не работает. shavid.webfactional.com
Показать ещё 4 комментария
Теги:

2 ответа

1
Лучший ответ

Я проверил ваш сайт, и он работал lol.

Код:

    $(function () {

      $('#slider').slider({
          value: 50,
          min: 10,
          max: 100,
          step: 10,
          slide: function (event, ui) {
              $("#slider-value").html(ui.value);
          },
          change: function (event, data) {
              alert(data.value)
              $("#slider-value").html($('#slider').slider('value'));
          }
      });

      $("#show-slider").click(function()
                              {
                                  $('#slide').toggle("slow");
                              });
   });

Вот скрипка. Я просто удалил одну из инициализации ползунков

Поделиться
  • 1
    Привет, я изменил мой сайт после того, как вы предоставили ответ :)
  • 0
    Рад, что смог помочь
0

Разница между скриптой и вашим сайтом заключается в том, что JSFiddle обертывает код внутри $(window).load(function(){/*code here*/});

Поделиться
  • 0
    Его код уже делает это на сайте. $(function() { });
  • 0
    Это не влияет на то, что веб-страница не выводит значение в зависимости от положения ползунка.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню